傳遞多個變量AJAX平變化選擇

我在看從W3schools.com（阿賈克斯，PHP和MySQL）這個腳本 http://www.w3schools.com/php/php_ajax_database.asp 傳遞多個變量AJAX平變化選擇

<html> 
<head> 
<script type="text/javascript"> 
function showUser(str) 
{ 
if (str=="") 
    { 
    document.getElementById("txtHint").innerHTML=""; 
    return; 
    } 
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 (xmlhttp.readyState==4 && xmlhttp.status==200) 
    { 
    document.getElementById("txtHint").innerHTML=xmlhttp.responseText; 
    } 
    } 
xmlhttp.open("GET","getuser.php?q="+str,true); 
xmlhttp.send(); 
} 
</script> 
</head> 
<body> 

<form> 
<select name="users" onchange="showUser(this.value)"> 
<option value="">Select a person:</option> 
<option value="1">Peter Griffin</option> 
<option value="2">Lois Griffin</option> 
<option value="3">Glenn Quagmire</option> 
<option value="4">Joseph Swanson</option> 
</select> 
</form> 
<br /> 
<div id="txtHint"><b>Person info will be listed here.</b></div> 

</body> 
</html>

這說明一個簡單的選擇有4個值。

這是PHP腳本。

<?php 
$q=$_GET["q"]; 

$con = mysql_connect('localhost', '*', '*'); 
if (!$con) 
    { 
    die('Could not connect: ' . mysql_error()); 
    } 

mysql_select_db("ajax_demo", $con); 

$sql="SELECT * FROM user WHERE id = '".$q."'"; 

$result = mysql_query($sql); 

echo "<table border='1'> 
<tr> 
<th>Firstname</th> 
<th>Lastname</th> 
<th>Age</th> 
<th>Hometown</th> 
<th>Job</th> 
</tr>"; 

while($row = mysql_fetch_array($result)) 
    { 
    echo "<tr>"; 
    echo "<td>" . $row['FirstName'] . "</td>"; 
    echo "<td>" . $row['LastName'] . "</td>"; 
    echo "<td>" . $row['Age'] . "</td>"; 
    echo "<td>" . $row['Hometown'] . "</td>"; 
    echo "<td>" . $row['Job'] . "</td>"; 
    echo "</tr>"; 
    } 
echo "</table>"; 

mysql_close($con); 
?>

現在我明白它做什麼，它是如何工作的，但讓我們說，我想3個變量傳遞給PHP腳本，當有人改變選擇框的值，我該怎麼辦？

來源

2012-04-18 Student

通過更改getuser.php的查詢字符串調用，這又意味着改變onChange函數或添加更多的onChange函數。或者將他onChange函數更改爲通過ID從每個表單字段中選擇值。另外，請勿在問題中發佈用戶名/密碼。即使你發佈了「測試」/「演示」版本，如果你發現了這種壞習慣，也很容易意外發布真實版本。如果這是你從頭開始做的事情，會考慮尋找一個框架來簡化這個，即jQuery來幫助跨瀏覽器的兼容性。 – 2012-04-18 10:14:56

如果我想發送像日期（而不是今天的日期）和時間的東西，該怎麼辦？所以我不得不改變這個代碼？ xmlhttp.open（「GET」，「getuser.php？q =」+ str，true）; 如果我想傳遞一個名爲d或t的變量。 xmlhttp.open（「GET」，「getuser.php？q =」+ str，true「＆d =」+ date，true）; 這樣的事情？ – Student 2012-04-18 10:19:52

http://bobby-tables.com/ - 如果'$ _GET [「q」]的值爲'1'，該怎麼辦？下降表; --'？ – fcalderan 2012-04-18 10:20:43

從我的意見繼，這裏是從2個選擇所採用的值的例子，並提交當兩者都填寫

// Notice the arguments are gone at the moment 
function showUser() { 
    // Retrieve values from the selects 
    var u = document.getElementByID('userSelect').value; 
    var g = document.getElementByID('groupSelect').value; 

    if (u=="" || g == "") { 
     document.getElementById("txtHint").innerHTML=""; 
     return; 
    } 

    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 (xmlhttp.readyState==4 && xmlhttp.status==200) { 
      document.getElementById("txtHint").innerHTML=xmlhttp.responseText; 
     } 
    } 

    xmlhttp.open("GET","getuser.php?u="+u+"&g="+g,true); 
    xmlhttp.send(); 
}

一個Ajax調用

然後基本形式

<form> 
    <select name="users" id="userSelect" onchange="showUser()"> 
     <option value="">Select a person:</option> 
     <option value="1">Peter Griffin</option> 
     <option value="2">Lois Griffin</option> 
     <option value="3">Glenn Quagmire</option> 
     <option value="4">Joseph Swanson</option> 
    </select> 
    <select name="groups" id="groupSelect" onchange="showUser()"> 
     <option value="">Select a group:</option> 
     <option value="a">Aerosmith</option> 
     <option value="k">Kiss</option> 
     <option value="l">Led Zeppelin</option> 
     <option value="m">Metallica</option> 
    </select> 
</form>

這不是一個美妙的選擇，雖然，提到會建議你到使用框架如jQuery（http://jquery.com/），你就可以花更多的時間上的邏輯而不是確保瀏覽器的兼容性

但是你儘管如此，它並沒有傷害到實驗，所以只需嘗試一些事情，看看會發生什麼（無論如何，只要不是刪除實時數據）

來源

2012-04-18 10:28:33

爲了發送多個值，您必須相應地更改查詢字符串。

xmlhttp.open("GET","getuser.php?q="+str,true);

要，像

xmlhttp.open("GET","getuser.php?q="+str+"&nextvar="+value1,true);

來源

2012-04-18 10:20:03 Starx

傳遞多個變量AJAX平變化選擇

回答

相關問題