使用jQuery更改了一个Dropdown的值

时间:2014-03-07 02:27:21

标签: jquery onchange

所以我看了看This post,它“几乎”做了我想要的。问题在于,在这个例子中,两个下拉列表的值都是相同的,所以它很容易说:

$("#dropdwon1").change(function(){
    $("#dropdwon2").val($(this).val());
});

对我来说,问题是我想将一个值映射到另一个值。

在我正在使用的示例中,我想从第一个下拉菜单中选择'cow'的值,在另一个中选择'134'的值。您可以看到我的jFiddle实际上看到了Class Type下拉列表和隐藏的下拉列表。因此映射将是:

<select id="edit-type" name="type" class="form-select">
    <option value="All" selected="selected">- Any -</option>
    <option value="bull">Bulls</option>
    <option value="cowpair">Cow/Calf Pair</option>
    <option value="cow">Cows</option>
    <option value="feeder">Feeders</option>
    <option value="female">Replacement Females</option>
    <option value="stocker">Stockers</option>
</select>

with:

<select id="edit-field-class-tax-tid" name="field_class_tax_tid" class="form-select">
    <option value="All" selected="selected">- Any -</option>
    <option value="139">Stockers</option>
    <option value="136">Cow/Calf Pairs</option>
    <option value="134">Cows</option>
    <option value="138">Feeders</option>
    <option value="135">Replacement Females</option>
    <option value="137">Bulls</option>
</select>
  

全部=全部
  bull = 137
  女= 135
  stocker = 139
  cowpair = 136
  牛= 134
  feeder = 138

我真的在这个问题上摸不着头脑。

2 个答案:

答案 0 :(得分:0)

由于下一个下拉列表中的值不同,您可能需要使用if或switch语句映射它吗?像

这样的东西
$("#edit-type").change(function(){

    var selectedVal = "All";
    if($(this).val() == 'cow')
        selectedVal = "134"
    //add the rest of the value mapping

    $("#edit-field-class-tax-tid").val(selectedVal);
});

<强>更新 如果你不希望有一个很长的if / switch块,也许你可以使用一个JSON对象来托管值并改为映射它。请参阅:How to populate a cascading Dropdown with JQuery

不确定是否还有其他更好的方法。希望这会有所帮助。

答案 1 :(得分:0)

  $("#edit-type").change(function(){    
    $("#edit-field-class-tax-tid option:contains("+ $(this).val() +")").attr('selected', true);   
});

这个答案与你的小提琴完全一致。但我不得不稍微改变一下这些值。如果要将第一个值与第二个文本的值进行比较,则必须相同。第一次下拉的价值是“牛”,另一次下调的文字是“牛”