在Javascript上調用PHP函數Onchange

Question

我想在html select中的php onchange中調用一個函數，這怎么辦？

HTML代碼

<div class="col-sm-4 form-group">
   <label for="c_city">City</label>
   <select class="form-control" id="c_city" onchange="<?php getArea(); ?>">
        <option value="">Select City Name</option>
        <!--populate value using php-->
        <?php
            $stmt ="SELECT * FROM Cities";
            foreach ($con->query($stmt) as $row) {
         ?>
         <option value="<?php echo $row['City_ID'];?>"><?php echo $row['City_Name'];?></option>
         <?php
          }
         ?>
   </select>
</div>

PHP函數頁面

function getArea() 
{
    if(isset($_GET['c_city'])) 
    {
        $c_city = $_GET['c_city'];
        echo $c_city;
    }
}

Answer 1

那樣就無法做到這一點，您需要AJAX 。 您的想法行不通，因為onchange是javascript（而非php）的保留函數。 如果執行代碼，則選擇更改時，只會將您的getArea（）回顯運行到javascript中，從而導致看不到預期的結果。 我在這里所做的是將js函數與ajax調用結合到您的php代碼中，從而幫助您根據需要檢索區域。 顯然，就像下面的評論一樣，這不是將綁定放入html代碼的好方法，因為當代碼開始增長時，維護變得非常昂貴-為解決此問題，我在jquery函數上使用了將某些偵聽器綁定到對象的方法，但是您可以使用也可以更改 。

但是，重要的是分析您是否真的需要在那里的JavaScript。 如果僅按照代碼建議的方式獲取一個值，則提交的表單會更簡單。

<div class="col-sm-4 form-group">
   <label for="c_city">City</label>
   <select class="form-control" id="c_city" onchange="getArea()"> //onchange is not a good practice in the html
        <option value="">Select City Name</option>
        <!--populate value using php-->
        <?php
            $stmt ="SELECT * FROM Cities";
            foreach ($con->query($stmt) as $row) {
         ?>
         <option value="<?php echo $row['City_ID'];?>"><?php echo $row['City_Name'];?></option>
         <?php
          }
         ?>
   </select>
</div>

<script>
   //that way with onchange in HTML
   function getArea(){
   var city = $('#c_city option:selected').val();
   $.get( "yourphpcode.php?action=getArea&c_city=" + city, function( data ) {

  alert( data );
});
   }
  //or THAT WAY
  $('#c_city').on('change', function(){
         var city = $(this).find('option:selected').val();
   $.get( "yourphpcode.php?action=getArea&c_city=" + city, function( data ) {

  alert( data );
});

   });
</script>


   //yourphpcode.php
    function getArea() 
{
    if(isset($_GET['c_city'])) 
    {
        $c_city = $_GET['c_city'];
        echo json_encode($c_city);
    }
}
    if (isset($_GET['action']) && $_GET['action'] == 'getArea'){
           getArea();
    }

Answer 2

您可以嘗試使用ajax來調用php腳本並將結果返回給javascript。

例如在您的html頁面中：

<div class="col-sm-4 form-group">
   <label for="c_city">City</label>
   <select class="form-control" id="c_city" onchange="getArea()">
        <option value="">Select City Name</option>
        <!--populate value using php-->
        <?php
            $stmt ="SELECT * FROM Cities";
            foreach ($con->query($stmt) as $row) {
         ?>
         <option value="<?php echo $row['City_ID'];?>"><?php echo $row['City_Name'];?></option>
         <?php
          }
         ?>
   </select>
</div>

<script>
 function getArea(){
  var c_city = $('#c_city').val();
   $.ajax({
           type: 'POST',
           url: "get_area.php",
           data: {c_city:c_city},
           success: function(result){
               //do something here with return value like alert
               alert(result)
           }
     })
}
</script>

然后在您的php腳本中，您可以操縱從javascript接收的值

if(isset($_POST['c_city'])) 
    {
        $c_city = $_POST['c_city'];
        echo $c_city;
    }

讓我知道這是否有幫助或您發現問題