平變化的功能添加到選定的jQuery WordPress的

我有問題，當我試圖平變化的功能添加到js文件的onchange我從得到它：https://www.w3schools.com/php/php_ajax_database.asp：平變化的功能添加到選定的jQuery WordPress的

jQuery(document).ready(function($) { 
    $('select.Nom').chosen({ width:"50%" }).change(function showUser(str) { 
    if (str == "") { 
     document.getElementById("txtHint").innerHTML = ""; 
     return; 
    } else { 
     if (window.XMLHttpRequest) { 
      // code for IE7+, Firefox, Chrome, Opera, Safari 
      xmlhttp = new XMLHttpRequest(); 
     } else { 
      // code for IE6, IE5 
      xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
     } 
     xmlhttp.onreadystatechange = function() { 
      if (this.readyState == 4 && this.status == 200) { 
       document.getElementById("txtHint").innerHTML = this.responseText; 
      } 
     }; 
     xmlhttp.open("GET","tableau.php?Nom="+str,true); 
     xmlhttp.send(); 
    } 
}); 
});

的tableau.php：

<?php 


    $q = intval($_GET['Nom']); 


    $query = "select Adresse, Nom from herboristes where Nom = '".$q."'"; 

    $result = mysqli_query($query); 

$row = mysqli_fetch_array($result) { 
echo $row['Adresse']; 
    } 
    } 

    ?>

所以我需要的到底是當我SELCT名稱（NOM）從中我使用此代碼創造我的下拉列表中顯示的住址信息：

<select class='Nom' onchange="showUser()" name='Nom' id='Nom'> 
<option value="">--- Select ---</option> 

[insert_php] 
$servername = "localhost"; 
$username = "root"; 
$password = ""; 
$conn = new mysqli($servername, $username, $password, "somapam_bd"); 

$sql = mysqli_query($conn, "SELECT Nom FROM herboristes"); 

while($ligne_liste=mysqli_fetch_array($sql)) { 
    echo '<option value="'.$ligne_liste['Nom'].'">'.$ligne_liste['Nom']."</option>\n"; 
} 
echo '</select>'; 
[/insert_php] 
<div id="txtHint"><b>Person info will be listed here...</b></div>

我使用選定的插件WordPress的下拉列表...這是非常複雜的WordPress，我真的需要你的幫助。謝謝

來源

2017-05-05 Mohamed Reda Aguezzoul

在我看來，'$（ 'select.Nom'）選擇（{寬度：「50％」}）變化（功能showUser（STR）{'看起來錯了 - 這應該是一個匿名函數，而我相信 – RamRaider

是的，但我不知道我將如何創建n anonymus函數... –

我根本沒有使用jQuery，所以這可能不是正確的或者做到這一點的方法，但實質上你可以創建一個匿名函數或使用一個命名函數（但不像你曾嘗試過）此方法使用命名函數，但調用方式不同。

<script> 
    function showUser(event) { 
     var el=event.target 
     var value=el.options[ el.options.selectedIndex ].value; 

     if (value == "") { 
      document.getElementById("txtHint").innerHTML = ""; 
      return; 
     } else { 

      var xhr=new XMLHttpRequest(); 

      xhr.onreadystatechange = function() { 
       if (this.readyState == 4 && this.status == 200) { 
        document.getElementById("txtHint").innerHTML = this.response; 
       } 
      }; 
      xhr.open("GET","tableau.php?Nom="+value,true); 
      xhr.send(); 
     } 
    } 


    jQuery(document).ready(function($) { 
     $('select.Nom').chosen({ width:"50%" }).change(showUser); 
    }); 

</script>

因爲您使用jQuery將事件偵聽器綁定到SELECT菜單，所以不需要內聯事件處理程序。

<select class='Nom' name='Nom' id='Nom'>

....代碼其餘

更新：上面的代碼中並沒有進行測試可言，但之後已經讓我相信你可以利用它。有一點需要注意的是，當我最初嘗試使用代碼$('select.Nom').chosen({ width:"50%" }).change時，它拋出錯誤，因此我從中刪除了.chosen({ width:"50%" })，接下來看起來工作正常。。

<?php 
    /* 

    this emulates the database calls you would make when calling tableau.php 

    */ 
    if($_SERVER['REQUEST_METHOD']=='GET'){ 
     if(!empty($_GET['Nom'])){ 

      exit($_GET['Nom']); 
     } 
    } 
?> 
<html> 
    <head> 
    <script src="//code.jquery.com/jquery-latest.js" type="text/javascript"></script> 
    <script> 

    function showUser(event) { 
     var el=event.target 
     var value=el.options[ el.options.selectedIndex ].value; 

     if (value == "") { 
      document.getElementById("txtHint").innerHTML = ""; 
      return; 
     } else { 

      var xhr=new XMLHttpRequest(); 

      xhr.onreadystatechange = function() { 
       if (this.readyState == 4 && this.status == 200) { 
        document.getElementById("txtHint").innerHTML = this.response; 
       } 
      }; 

      /* url has been edited for the demo */ 
      xhr.open("GET","?Nom="+value,true); 
      xhr.send(); 
     } 
    } 
    jQuery(document).ready(function($) { 
     $('select.Nom').change(showUser); 
    }); 
    </script> 
    </head> 
    <body> 
    <form> 
     <select class='Nom' name='Nom' id='Nom'> 
     <option value='name_1'>Name 1 
     <option value='name_2'>Name 2 
     <option value='name_3'>Name 3 
     <option value='name_4'>Name 4 
     </select> 
     <div id="txtHint"><b>Person info will be listed here...</b></div> 
    </form> 
    </body> 
</html>

來源

2017-05-05 15:22:42 RamRaider

感謝您評論@RamRaider，但它不工作，我得到一個錯誤列表，當我檢查頁面： –

平變化的功能添加到選定的jQuery WordPress的

回答

相關問題