Question

我有两个<select>标记，其中包含ID user1和user2。根据我在user1框中选择的内容，应在user2选择框中添加相同选项作为选项。然而，这没有发生。以下代码添加了选项，并在下一个瞬间消失了。在调试过程中，我发现在user2事件结束时删除了onchange中的选项。

我有一个onchange事件附加到user1框，触发了一个函数lookForRevs()

<select id="user1" class="69" onchange="lookForRevs()">
   <option value="">Select User</option>
   <option value="11">John</option>
   <option value="85">Kumar</option>
</select>

<select id="user2">
   <option value="">Select User</option>
</select>

function lookForRevs() {
    var myText = $('#user1').find("option:selected").text();
    var myValue = $('#user1').find("option:selected").val();
    $('#user2').append(new Option(myText, myValue));
}

小提琴：http://jsfiddle.net/YkC4r/

Answer 1

昌河属性用户id进入你的user2选择如下：

<select id="user2">

我在jQuery上添加了一个解决方案，它使用jQuery中的事件更改而不使用onchange

$('#user1').change(function(){
    var myText = $('#user1').find("option:selected").text();
    var myValue = $('#user1').find("option:selected").val();
    $('#user2').append(new Option(myText, myValue));
});

<强> DEMO

Answer 2

<select id="user2">
   <option value="">Select User</option>
</select>


function lookForRevs() {
    var myText = $('#user1').find("option:selected").text();
    var myValue = $('#user1').find("option:selected").val();
    $('#user2').append('<option value="'+myValue +'">'+myText +'</option>');
}

此行在IE 8中不起作用。

$("#selectList").append(new Option("option text", "value"));

在这一行，我们尝试使用append将HTMl DOM Object添加到Jquery。完全做到如下所示的Jquery方式减少了跨浏览器问题的可能性。

$('#user2').append('<option value="'+myValue +'">'+myText +'</option>');

其他方式可能是

var o = new Option("option text", "value");
/// jquerify the DOM object 'o' so we can use the html method
$(o).html("option text");
$("#selectList").append(o);

工作http://jsfiddle.net/DwkMk/

使用jquery附加到<select>标签的选项在函数超出范围</select>后消失

2 个答案: