1

私は次のコードを持っています:

$('#test')
    .append($.map(this.items, function (item, index) {
        return '<li><input type="checkbox" value="' + item.key + '">' item.title + '</li>'
    }).join(''));

しかし、私はそれをもっとこのようにしたいと思います:

$('#test')
    .append($.map(this.items, function (item, index) {
        return $('<li/>').append('<input/>', {type: 'checkbox', value: item.key}).text(item.title)
    });

しかし、これはうまくいくようです。誰でも助けることができますか？

編集 RLの状況では答えが当てはまらないようです（説明するためにコードを短くしました）ここに私の実際のコードがあります：

_RenderCheckbox: function () {
    $('<ul/>')
        .appendTo(this.element)
        .addClass('widget')
        .append($('<input>').attr({ type: 'text', class: 'field', 'data-map': this.element.attr("data-map") }))
        .append($.map(this.items, function (item, index) {
                return '<li><label><input type="checkbox" value="' + item.key + '">' + item.parent + item.title + '</label></li>'
        }).join(''));
},

これは、私が開発している jquery ui ウィジェットの一部です。

4

2 に答える 2

1

.text()の内容を置き換えます<li>。あなたがする必要がありますappend/prependあなたの要素:

return $('<li />', {
    text: item.title
}).append($('<input />', {
    type: 'checkbox',
    value: item.key
}));

また、使用しないでくださいjoin()。このコードを$.each:

var $test = $('#test');

$.each(this.items, function(item, index) {
    var $li = $('<li />', {
        text: item.title
    }).appendTo($test);

    $('<input />', {
        type: 'checkbox',
        value: item.key
    }).appendTo($li);
});

そして、巨大なワンライナーが好きなら：

var $test = $('#test');

$.each(this.items, function(item, index) {
    $('<li />', {
        text: item.title
    }).appendTo($test)
      .append($('<input />', {
        type: 'checkbox',
        value: item.key
    }));
});
于 2013-01-11T17:36:12.577 に答える
0

間違ったオブジェクトを返さないように、つなぎ合わせてみましたか? これはうまくいくかもしれません：

$('#test')
.append($.map(this.items, function (item, index) {
    var ret = $('<li/>');
    var input = ret.append('<input/>', {type: 'checkbox', value: item.key});
    input.text(item.title);
    return ret;
});
于 2013-01-11T17:37:26.450 に答える