javascript - 无法使用javascript/jquery在下拉列表中动态设置值

我有一个问题。我想使用javascript / Jquery在onchange事件的下拉列表中设置值。我在下面解释我的代码。

<h1>drop down</h1>
<p>
    <select id="leaveCode" name="leaveCode" onChange="SetValue();">
        <option value="10">Annual Leave</option>
        <option value="11">Medical Leave</option>
        <option value="14">Long Service</option>
        <option value="17">Leave Without Pay</option>
    </select>
</p>
<p>
    <select id="leaveCode1" name="leaveCode">
        <option value="">select value</option>
        <option value="21">xyz</option>
        <option value="21">abc</option>
    </select>
</p>

function SetValue(){
  var value=document.getElementById('leaveCode').value;
  var name=document.getElementById('leaveCode').name;
  document.getElementById('leaveCode1').value=value;
  document.getElementById('leaveCode1').name=name;
}

在这里我的要求是当用户从第一个下拉列表中选择任何值时，它也会在禁用模式下显示在第二个下拉列表中。请帮助我。

最佳答案

您可以使用以下语句添加并在leftcode1下拉列表中进行选择。在js文件中使用以下语句

   jQuery('#leaveCode').change(function(){
        //get selected text from #leaveCode list
        text = jQuery("#leaveCode option:selected").text();
        //get selected value for selected text
        value = jQuery("#leaveCode option:selected").val();
//append new in #leavecode1 and make this option as selected option.
        jQuery("#leaveCode1").append("<option value=" + value + " selected>" + text + "</option>");



    });

您可以使用以下链接（已更新）-http://jsfiddle.net/aecrcvt2/2/进行检查