Question

我尝试将一个选择框项目复制或移动到另一个选择框。问题是当一个或多个项目从第一个框移动到第二个框时，应该选择它。但它没有用。

我的代码

function SelectMoveRows(SS1,SS2)
{


    var SelID='';
    var SelText='';
    var SelText2='';
    // Move rows from SS1 to SS2 from bottom to top
    for (i=SS1.options.length - 1; i>=0; i--)
    {
        if (SS1.options[i].selected == true)
        {
            SelID=SS1.options[i].value;
            SelText=SS1.options[i].text;
            SelText2=SS1.options[i].attr("selected");

            var newRow = new Option(SelText,SelID,SelText2);
            SS2.options[SS2.length]=newRow;
            SS1.options[i]=null;
        }
    }
    SelectSort(SS2);
}

然后我用

   SelText2=SS1.options[i].attr("selected");

但它没有用。如果我使用：

SelText2=SS1.options[i].select=true;

然后选项如下：

<option value="3" selected="">Delivery</option>

但它应该是：

<option value="3" selected="selected">Delivery</option>

Answer 1

在选项标签中，所选属性不需要值：

<option value="3" selected>Delivery</option>

与

相同

<option value="3" selected="selected">Delivery</option>

在这里查看：

http://jsfiddle.net/n99L2xhv/1/

Answer 2

你应该使用.prop not .attr

e.g。

SelText2=SS1.options[i].prop("selected", true);

供参考：.prop() vs .attr()

更新我会按照以下方式执行此操作;

<select id="select1">
    <option value="1">Option1</option>
    <option value="2">Option2</option>
</select>

<select id="select2">
    <option value="3">Option3</option>
</select>

$("#select1").change(function(){
    $("#select1 option:selected").each(function() {
        var option = $(this);
        $("#select2").append(option);
        $("#select1").remove(option);
    });
});

选择此选项后，这会将所选选项从选择1移至选择2。

Answer 3

正如David Thomas在评论中指出的那样，.attr()不是选择元素的有效方法;这是一个jQuery对象的方法，你没有。

您可以将true作为参数传递给Option构造函数，第三个参数实际上是defaultSelected属性，而第四个参数是selected属性

for (var i = SS1.options.length - 1; i >= 0; i--) {
    var option = SS1.options[i];
    if (option.selected) {
        SS2.add(new Option(option.text, option.value, false, true));
        SS1.remove(i);
    }
}

您可以使用option.selected代替true，但由于if语句，您知道option.selected始终为true。

jsfiddle

选择框选项未显示已选中

3 个答案: