jQuery在每个单选按钮或复选框旁边添加空标签

2nbm6dog  于 2023-06-22  发布在  jQuery
关注(0)|答案(4)|浏览(125)

我需要一个简单的jQuery代码,将添加一个空的标签标签旁边的每个单选按钮或复选框
例如:

$('input[type="radio"]').next().add("<label for="radio"></label>");
$('input[type="checkbox"]').next().add("<label for="checkbox"></label>");

我怎么能做到这一点?
谢谢

h6my8fg2

h6my8fg21#

您需要使用after来完成此操作。此外,您希望标签的for是它引用的id

$('input[type="checkbox"]').each(function() {
     var cb = $(this);
     cb.after($("<label />")
                .attr("for", cb.attr("id")) );
});

你说你想要空标签,但为了以防万一,如果你想让标签显示它们旁边复选框的值,这应该可以做到:

$('input[type="checkbox"]').each(function() {
     var cb = $(this);
     cb.after($("<label />")
                .attr("for", cb.attr("id"))
                .text(cb.val()) );
});
mkshixfv

mkshixfv2#

$('input[type="radio"]').after("<label for='radio'></label>");
$('input[type="checkbox"]').after("<label for='checkbox'></label>");
5rgfhyps

5rgfhyps3#

你想使用jQuery函数.after()

$('input[type="radio"]').after('<label for="radio"></label>');
$('input[type="checkbox"]').after('<label for="checkbox"></label>');

但是,如果你想让标签指向正确的元素,你需要这样做:

$('input[type="radio"], input[type="checkbox"]').each( function() {
    var id = $(this).attr( "id" );
    $(this).after('<label for="' + id + '"></label>');
} );

您需要将元素的id放在label标记的for属性中

gkl3eglg

gkl3eglg4#

$(':radio, :checkbox').each(function () {
    $(this).before('<label for="' + this.id + '"></label>');
});

相关问题