Question

我有2个选择框。选择两者后是否有办法执行某项操作？

我希望用户从2个选择框中选择一个起点和一个目的地，一旦选择了两个值，我想显示一个价格。

<label>Suburb</label>
<select id="delivery_from_area" name="delivery[from_area]"><option value="">Select</option>
<option value="1">Atlantic Seaboard</option>
<option value="2">City Bowl</option></select>

<label>Suburb</label>
<select id="delivery_to_area" name="delivery[to_area]"><option value="">Select</option>
<option value="1">Atlantic Seaboard</option>
<option value="2">City Bowl</option></select>

我的尝试

    $("#delivery_from_area").on("change",function(){
         var check1 = $("#delivery_from_area").text();
         var check2 = $("#delivery_to_area").text();
         if(check1!="" && check2!="") {
            var value1 = $("#delivery_from_area option:selected").text();
            var value2 = $("#delivery_to_area option:selected").text();
            //calculate value
        }
   });

$("#delivery_to_area").on("change",function(){
         var check1 = $("#delivery_from_area").text();
         var check2 = $("#delivery_to_area").text();
         if(check1!="" && check2!="") {
            var value1 = $("#delivery_from_area option:selected").text();
            var value2 = $("#delivery_to_area option:selected").text();
            //calculate value
        }
   });

Answer 1

您可以拥有两个事件侦听器，每个选择一个。当其中一个事件被触发时，您只需确认另一个事件是否已有值，如果是，则显示价格，如果不是，则忽略并等待其他操作。

示例：

  $("#select1").on("change",function(){
             var value1 = $(this).val();
             var value2 = $("#select2").val();
             if(value2!="" && value1!="") //Check if are both selected
                     //do your stuff
       });

工作示例：jsfiddle.net/pnFx6

Answer 2

$("#delivery_to_area").on("change",function(){
    if($('#delivery_from_area').text()=='Select' && $('#delivery_to_area').text=='Select')
    {
        alert("please select value in drop down");
    }
    else
    {
        alert("Your calculated value");
    }
});

如何在2个选择框更改后执行操作

2 个答案: