Jquery + 将复选框值添加到 href 元素

Question

这是我所拥有的:

$(function() { 
    $('#find_1 input[type="checkbox"]').change(function() { 
        var $t = $("#t");
        if ( this.checked )
            $t.append(($t.text()?",":"")+this.value);
        else
            $t.text($t.text().replace(
                  new RegExp("\\b"+this.value+"\\b"), ""
            ));
    }).change();
});

我需要的是在目标#t的a href中写入复选框值

例如:

选中的复选框:

[x]red

[ ]green

[x]blue

应该产生这样的href:

<div id"t"><a href"/colors/red,blue">preview colors</a>

当然，当用户单击/取消单击复选框时，将添加/删除颜色。

感谢您的帮助。

Answer 1

我会这样做:

$('#find_1 input:checkbox').change(function() { 
    var colours = $("#find_1 input:checkbox:checked").map(function() {
        return this.value;
    }).get().join(',');
    $("#t").find("a").attr('href', '/colors/' + colours);
}).change();

You can try it out here.