私は2つのULと1つのボタンを持っています
<ul class="droptrue ui-sortable" id="sortable1" style="min-height: 128px; mozuserselect: none;"
unselectable="on">
<li id="article_1" class="ui-state-default">
<input type="checkbox" id="1" />
Article #1</li>
<li id="article_2" class="ui-state-default">
<input type="checkbox" id="2" />
Article #2</li>
<li id="article_3" class="ui-state-default">
<input type="checkbox" id="3" />
Article #3</li>
</ul>
<ul class="droptrue ui-sortable" id="sortable2" style="min-height: 128px; mozuserselect: none;"
unselectable="on">
<li id="article_4" class="ui-state-default">
<input type="checkbox" id="4" />
Article #4</li>
<li id="article_5" class="ui-state-default">
<input type="checkbox" id="5" />
Article #5</li>
<li id="article_6" class="ui-state-default">
<input type="checkbox" id="6" />
Article #6</li>
</ul>
<input type="button" id="add" value=">>" style="width: 15px" onclick="AddToList()" />
ボタンをクリックすると、対応するliフォーム「sortable1」を削除して「sortable2」に挿入する必要があります。
私は次のような関数を書きました
function AddToList() {
var vals = $('#sortable1 input:checkbox:checked').map(
function() {
$("#sortable2").append($(this).parent().html());
$(this).parent().remove();
return this.id;
}).get().join(',');
}
ただし、この関数はliを削除しますが、チェックボックスのみを他のulに追加します。$(this).parent()。parent()。html()を指定すると、他のulにすべてのliが追加されます。ここで欠落しているものを教えてください。