jQuery獲取多個選擇框的選定值

Question

我有這個表格..

<form method="post" action=''>

    <select class="first">
       <option value="0">choose ...</option>
       <option value="1">Hello</option>
       <option value="3">It's</option>
    </select>

    <select class="second">
       <option value="0">choose ...</option>
       <option value="2">World</option>
       <option value="4">me</option>
    </select>

    <input type="text" class="dest" value="" />

</form>

並希望使用jQuery動態收集選定的信息，因為我需要確定選定的值...

當您選擇OPTION值的特定組合（例如，Hello + World）時，應將一些值添加到INPUT.dest並將其鎖定（禁止編輯）...

但我無法使其工作……我所擁有的是，在每次選擇的每次更改（僅單獨進行）時，我都可以映射實際值

  $(document).ready(function () {

    $(".first").change(function () {        
        var option = $(this).find("option:selected").val();
        $(".dest").val(option);
    });

    $(".second").change(function () {        
        var option2 = $(this).find("option:selected").val();
        $(".dest").val(option2);
    });

  });

這是小提琴的現場演示

你知道我在想什么嗎？ 我知道這只是一件小事..謝謝

Answer 1

我將其概括並使用一個事件偵聽器，然后收集組合並執行任何操作：

$("select").change(function () {        
    var first = $(".first").find("option:selected").val();
    var second = $(".second").find("option:selected").val();

    if(first == 1 && second == 2)
            $(".dest").val("Hello world").prop("disabled",true);
    else
         $(".dest").val("Something else").prop("disabled",false);
});

http://jsfiddle.net/cxx428af/3/