当第一个选择的值更改时,无法获取jquery来设置选择输入的值

时间:2011-09-30 14:37:39

标签: javascript jquery forms select input

当我更改另一个选择输入的值时,我正在尝试更新选择输入的值。我无法在页面上发生任何事情,并希望确保我在此代码中没有语法错误或其他一些愚蠢的事情。

<div class="group">
<div class="inputs types">
<strong style="font-size:13px;">Category:</strong>
   <select name="id" id="ctlJob">
<option value="1">Automotive</option>
<option value="2">Business 2 Business</option>
<option value="3">Computers</option>
<option value="4">Education</option>
<option value="5">Entertainment & The Arts</option>
<option value="6">Food & Dining</option>
<option value="7">Government & Community</option>
<option value="8">Health & Beauty</option>
<option value="9">Home & Garden</option>
<option value="10">Legal & Financial Services</option>
<option value="11">Professional Services</option>
<option value="12">Real Estate</option>
<option value="13">Recreation & Sports</option>
<option value="14">Retail Shopping</option>
<option value="15">Travel & Lodging</option>
  </select>
<select name="type" id="ctlPerson"></select>
</div>
</div>

<script>
$(function() {
    $("#ctlJob").change(function() {
        //Get the current value of the select
        var val = $(this).val();

 $('#ctlPerson').html('<option value="123">ascd</option>');
    });    
});
</script>

3 个答案:

答案 0 :(得分:0)

请尝试使用append

$(function() {
    $("#ctlJob").change(function() {
        //Get the current value of the select
        var val = $(this).val();
        var ctl = $('#ctlPerson').append('<option value="123">'+val+'</option>')[0].options;
        ctl.selectedIndex = ctl.length-1;
    });
});

http://jsfiddle.net/J69q8/

答案 1 :(得分:0)

我认为你还需要设置'selected'属性。添加

$('#ctlPerson option[value="123"]').attr('selected', 'selected');

到脚本的末尾。您当前正在将选项添加到选择列表,但不会更改选择列表以显示它。

答案 2 :(得分:0)

<div id="test">
<select name="sel" id="sel">
    <option name="1" id="1" value="1">Automotive</option>
    <option name="2" id="1 value="2">Business 2 Business</option>
    <option name="3" id="1 value="3">Computers</option>
</select>
<select name="sel2" id="sel2"></select>
</div>

<script>
$("#sel").change(function() {
    var val = $(this).val();
    $('#sel2').html('<option value="1">NEW</option>');
)};
</script>

这适用于您需要做的事情。 它就像你拥有的东西