選擇選項不工作，以及觸摸屏設備

Question

我的前端代碼：

<div class="form-group col-md-3"> 
    <label for="taluka">Select Taluka</label> 
    <select name="taluka" id="taluka" required class="form-control"> 
     <option value="" selected disabled>Select Taluka</option> 
     <?php $Adder->listTalukas(); ?> 
    </select> 
</div> 
    <div class="form-group col-md-3"> 
    <label for="city">Select City</label> 
    <select name="city" id="city" required class="form-control"> 
     <option value="" selected disabled>Select City</option> 
    </select> 
</div> 
<div class="form-group col-md-3"> 
    <label for="pincode">Select pincode</label> 
    <select name="pincode" id="pincode" required class="form-control"> 
     <option value="" selected disabled>Select pincode</option> 
    </select> 
</div> 

這是我的jQuery代碼：

$(document).ready(function() 
    { 
    $("body").on("click", "select#taluka option",function() 
     { 
      var taluka_id = $("#taluka").val(); 

      if(taluka_id != "") 
       { 
        $.ajax({ 
          url: 'get_data.php?id=getCity', 
          type: 'POST', 
          dataType: 'html', 
          data: {taluka_id : taluka_id}, 
         }) 
         .done(function(resp) 
          { 
           $("#city").html("<option value='' selected disabled>Select City</option>"); 
           $("#pincode").html("<option value='' selected disabled>Select Pincode</option>"); 
           $("#city").append(resp); 
          }) 
         .fail(function() 
          { 
           console.log("error"); 
          }); 
       } 
     }); 

    $("body").on("click", "select#city option",function() 
     { 
      var city_id = $("#city").val(); 

      if(city_id != "") 
       { 
        $.ajax({ 
          url: 'get_data.php?id=getPincode', 
          type: 'POST', 
          dataType: 'html', 
          data: {city_id : city_id}, 
         }) 
         .done(function(resp) 
          { 
           $("#pincode").html("<option value='' selected disabled>Select Pincode</option>"); 
           $("#pincode").append(resp); 
          }) 
         .fail(function() 
          { 
           console.log("error"); 
          }); 
       } 
     }); 
}); 

我正通過JQuery的調用get_data.php文件：？

<?php 
    if(extract($_POST) > 0) 
     { 
      $id = $_GET['id']; 

      include("config.php"); include("classes.php"); 

      switch($id) 
       { 
        case 'getCity': 
        echo $Adder->listCities($_POST['taluka_id']); 
        break; 

        case 'getPincode': 
        echo $Adder->listPincodes($_POST['city_id']); 
        break; 

        default: 
        // echo "None"; 
        break; 
       } 
     } 

>

代碼工作正常，它發送POST請求以及獲得響應還有問題是，點擊事件只能在Mozilla Firefox瀏覽器中觸發。它不適用於Chrome以及移動觸摸屏瀏覽器，爲什麼呢？

請提供解決方案。在此先感謝

Answer 1

使用on('change',"#selector_of_select",function(){})用於檢測變化值

$("body").on("change", "select#taluka",function(){ 
// your code remain same 
}); 


$("body").on("change", "select#city",function(){ 
// your code remain same 
});