0

我试图在按下按钮后将复选框添加到项目列表（链接）中。

这个想法是我得到了链接列表，例如：

  • 谷歌.com。
  • 必应网
  • 美国有线电视新闻网

等等，我在页面底部有按钮，一旦单击按钮，我想为每个链接添加复选框，但每个框 id 应该是它所附加的链接的序列号。

$("#links_remove").click(function(event) {


$('.links').after('<div><label> Check box to remove link: <input type="checkbox" class=" removebox" id="'+$(this).attr("id").split("_")[1]+'"></div>');
});

这是HTML

<a class="links" id="link_27" href="google.com">google.com</a>

但是当然 $(this) 选择器获取按钮的属性（“links_remove”）而不是当前链接的属性。

谢谢！

4

3 回答 3

3

您可以使用指向当前链接的函数参数。after()this

$("#links_remove").click(function(event) {
    $('.links').after(function(index) {

        // here "this" refers to the current ".link" and not "#links_remove"

        return '<div><label> Check box to remove link: <input type="checkbox" class=" removebox" id="'+this.id.split("_")[1]+'"></div>';
    });
});
于 2013-07-19T10:14:06.367 回答
0

这应该可以完成工作：

$('.links').each(function(){
    $(this).after('<div><label> Check box to remove link: <input type="checkbox" class=" removebox" id="'+$(this).attr("id").split("_")[1]+'"></div>');
});
于 2013-07-19T10:14:14.627 回答
0

我只是使用了一个 for-each 循环来获取所有链接：http: //jsfiddle.net/ehV9L/

$("#links_remove").click(function (event) {
    $('.links').each(function () {
        $(this).after('<span><label> Check box to remove link: <input type="checkbox" class="removebox" id="' + $(this).attr("id").split("_")[1] + '"></span>');
    });
});

<ul>
    <li><a class="links" id="link_01" href="http://www.google.com">Google</a></li>
    <li><a class="links" id="link_02" href="http://www.bing.com">Bing</a></li>
    <li><a class="links" id="link_03" href="http://www.cnn.com">CNN</a></li>
</ul>
<input type="button" id="links_remove" value="Remove Links" />
于 2013-07-19T10:30:42.390 回答