如何使用jquery重新排序表单字段

Question

我有一个PHP页面，其形式如下：

<form class="form3">
<label class="form3"><input type="checkbox"> Item-1</label>
<label class="form3"><input type="checkbox"> Item-2</label>
<label class="form3"><input type="checkbox"> Item-3</label>
<label class="form3"><input type="checkbox"> Item-4</label>
<label class="form3"><input type="checkbox"> Item-5</label>
</form>

我有javascript变量设置如下：

var checked = ["", "yes", "", "yes", ""];

现在当页面加载时，我想检查选中的值是否为“是”，然后我想将这些输入项放在列表中，其余的放在后面，如下所示：

<form class="form3">
<label class="form3"><input type="checkbox" checked="checked"> Item-2</label>
<label class="form3"><input type="checkbox" checked="checked"> Item-4</label>
<label class="form3"><input type="checkbox"> Item-1</label>
<label class="form3"><input type="checkbox"> Item-3</label>
<label class="form3"><input type="checkbox"> Item-5</label>
</form>

我假设，jQuery将是这样做的方式。 这意味着，我将需要遍历表单字段（我不知道如何）并在循环内检查相应的变量是否为空或“是”，如果是，则打印该表单字段。 然后再次通过相同的循环并打印相应变量为空的所有字段。

希望逻辑是正确的。

我能够像这样遍历表单元素：

$.each($('.form3'),function(i,e){
    if(checked[i] == "")
        {
            e.appendTo($('.form3'));
        }
});

但很明显，appendTo行给了我错误：

Uncaught TypeError: Object #<HTMLLabelElement> has no method 'appendTo'

所以，现在我需要知道如何选择每一行并在循环时重新排序它们。

谢谢

Answer 1

试试这个：

$('.form3').each(function(i,e) {

    if(checked[i] == "") {

        $(this).find('input[type=checkbox]').attr('checked', true);
        $(this).appendTo($('form'));

    }

});

Answer 2

你是在正确的方向思考这是我将如何照顾这个：

$('.form3').each(function(){
    var lbl = $(this);
    var chk = lbl.find('input[type=checkbox]');
    if(chk.attr('checked'))
    {
        lbl.prependTo($('#myForm'));
    }
});

你可以在这里找到一个有效的例子： http ： //jsfiddle.net/saelfaer/LbMQG/1/