jQuery的：生成表格单元格的内容链接

我有一个很好的表jQuery的：生成表格单元格的内容链接

<table id="#table1"> 
    <tr> 
    <td class="column1">foo1</td> 
    <td class="column2">#bar1</td> 
    </tr> 
    <tr> 
    <td class="column1">foo2</td> 
    <td class="column2">#bar2</td> 
    </tr> 
</table>

我想选择第二列和替换链接的内容，在TD对HREF的使用值。所以最终结果应该是：

<table id="#table1"> 
    <tr> 
    <td class="column1">foo1</td> 
    <td class="column2"><a href="#bar1">link</a></td> 
    </tr> 
    <tr> 
    <td class="column1">foo2</td> 
    <td class="column2"><a href="#bar2">link</a></td> 
    </tr> 
</table>

所以我选择td并用一个很好的href来包装它。

$("td.column2").wrapInner(function() { 
    return "<a href='" + this.nodeValue + "'></a>"; 
});

然而，这产生这样的：

<table id="#table1"> 
    <tr> 
    <td class="column1">foo1</td> 
    <td class="column2"><a href="null">#bar1</a></td> 
    </tr> 
    <tr> 
    <td class="column1">foo2</td> 
    <td class="column2"><a href="null">#bar2</a></td> 
    </tr> 
</table>

我在做什么错？我可能忽略了一些荒谬简单的事情，但这是漫长的一天。谢谢你的帮助！

来源

2013-09-24 user2811397

不要在IDS使用''＃。您正在将CSS语法混合到您的html中。 CSS中的'＃'相当于html中的'id ='。当id包含'＃'字符（例如，'id =“＃table1”'）时，要通过CSS引用一个id元素，你需要转义hash：'＃\＃table1 {}'see [this article ]（http://mathiasbynens.be/notes/css-escapes）了解更多信息。 – gilly3

DEMO

$("td.column2").html(function() { 
    return "<a href='" + this.innerHTML + "'>Link</a>"; 
});

或

DEMO

如果你想链接的文字是一样的以前的文本

$("td.column2").html(function() { 
    return "<a href='" + this.innerHTML + "'>"+this.innerHTML+" </a>"; 
});

参考

innerHTML

.html()

来源

2013-09-24 14:34:14

这就是现货。奇迹般有效。非常感谢！ – user2811397

@ user2811397欢迎帮助:) –

我结束了使用'$（“td.column2”）。html（function（）{ return“Link”; }）;'按照其他人的建议。感谢大家的快速帮助！ – user2811397

使用jQuery，以及让你TD的价值......（它只是更连贯到时，你可以使用jQuery），这是它的文字：

第一块答案：与$(this).text()更换this.nodeValue。

第二条回答：我认为你正在使用wrapInner()错误。请参阅http://api.jquery.com/wrapInner/您想要做的是替换您的td的内容。所以，你应该实际使用$('td.column2').html(function() { // etc }) ;

来源

2013-09-24 14:34:03 Lyth

我建议：

$('td.column2').html(function(i,h){ 
    var text = $(this).text(); 
    return '<a href="' + text + '">' + text + '</a>'; 
});

JS Fiddle demo。

来源

2013-09-24 14:35:41

使用

$("td.column2").html(function() { 
    var self = $(this); 
    return $('<a>',{ 
     href: self.text(), 
     text: 'link' 
    }); 
});

演示在http://jsfiddle.net/V4dFj/

来源

2013-09-24 14:36:34

使用{params} +1（我不知道）。这意味着更好的可读性。 – Lyth

@奥斯汀我看不到要保留内容的地方。在他的例子中，它被完全取代。 – Lyth

@奥斯汀，不，他不。他希望'＃bar1'和'＃bar2'成为'link'。但他使用了错误的方法，因此除了没有创建正确的链接外，他还将现有的文本保留为链接文本。 –

http://jsfiddle.net/kasperfish/p68pH/

$(function() { 

    $("td.column2").wrapInner(function() { 
    return "<a href='" + $(this).html() + "'></a>"; 
    }); 

});

来源

2013-09-24 14:37:35

这个href值和链接名称。所以它显示Link bar1# – user2811397

你的问题是在链接中显示表格单元格内容。不删除特殊字符。 –

jQuery的：生成表格单元格的内容链接

回答

相关问题