3

jsFiddleでこれをかなり理解しましたが、最初の値に箇条書きが追加されない理由はわかりません。

http://jsfiddle.net/dvCmR/128/

<div id="checkboxes">
    <input id="chkbx_0" type="checkbox" name="one" />Option 1
    <input id="chkbx_1" type="checkbox" name="two" />Option 2
    <input id="chkbx_2" type="checkbox" name="three" />Option 3
    <input id="chkbx_3" type="checkbox" name="four" />Option 4
</div>

<div class="content"></div>

<script>
    $("input").click(function(e) {

    var selected = $("#checkboxes input:checked").map(function(i, el) {
        return el.name;
    }).get();

    $('.content').empty();

    $(".content").append(selected.join("<li>"));

});
</script>

</ p>

ありがとう！！！

4

3 に答える 3

2

この関数は、要素の間.join()に文字列を配置するだけです。したがって、結果は

 name1<li>name2<li>name3

必要なときに

 <li>name1<li>name2<li>name3

<li>また、要素をにドロップすること<div>はかなり疑わしいです。

を引き続き使用できますが、(結合後に) 空でない場合は、結果文字列の先頭に.join()別の文字列を追加する必要があります。<li>

于 2012-08-25T16:39:06.930 に答える
2

@Pointy が言ったように、単一の要素がある場合joinは追加されません。liまた、まったく使用する必要はありませんjoin。単一のループで要素を追加するだけです。

$("input").click(function(e) {
    var $content = $('.content').empty();
    $("#checkboxes input:checked").each(function(i, el) {
       $("<li>" + el.name + "</li>").appendTo($content);
    });
});​

デモ。

于 2012-08-25T16:44:02.913 に答える
2

これを試して：

$("input").click(function(e) {
    var selected = $("#checkboxes input:checked").map(function(i, el) {
        return "<li>"+el.name+"</li>"
    }).get();
    $(".content").html(selected.join(""));
});

フィドル

于 2012-08-25T16:45:08.217 に答える