基于链接文本的Ajax mysql查询,页面上有多个链接

时间:2014-06-03 09:37:58

标签: javascript php mysql ajax

我在页面上有一些链接。当用户单击链接时,它使用mysql查询的WHERE子句中的链接中的文本,并使用ajax将结果返回到页面。

我需要多个ID或类来运行不同的查询。我已经尝试了querySelectorAll多个ID(见下文)和getElementsByClassName()多个类,但查询在WHERE子句中返回未定义的两个。

我可以使用getElementById在一个链接上工作。

我做错了什么?

HTML:

<ul>
    <li><a id="spquery" onclick='ajaxFunction()'>John</a></li>
    <li><a id="spquery1" onclick='ajaxFunction()'>Jill</a></li>
</ul>
<div id='ajaxDiv'>Results will display here</div>

使用Javascript:

<script languspquery="javascript" type="text/javascript">
<!-- 
//Browser Support Code
function ajaxFunction(){
 var ajaxRequest; 

 try{
   // Opera 8.0+, Firefox, Safari
   ajaxRequest = new XMLHttpRequest();
 }catch (e){
   // Internet Explorer Browsers
   try{
      ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
   }catch (e) {
      try{
     ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
  }catch (e){
     // Something went wrong
     alert("Your browser broke!");
         return false;
      }
   }
 }

 ajaxRequest.onreadystatechange = function(){
   if(ajaxRequest.readyState == 4){
      var ajaxDisplay = document.getElementById('ajaxDiv');
      ajaxDisplay.innerHTML = ajaxRequest.responseText;
   }
 }
// below you can see I'm using querySelectorAll with multiple ids
 var spquery = document.querySelectorAll('#spquery, #spquery1').text;
 var queryString = "?spquery=" + spquery ;
 ajaxRequest.open("GET", "/the-bootstrap/ajax-ped.php" + queryString, true);
 ajaxRequest.send(null); 
}
//-->
</script>

来自/the-bootstrap/ajax-ped.php的

的mysql查询
$spquery = $_GET['spquery'];
$query = "SELECT * from people";
$query .= " WHERE personname = '$spquery'";

1 个答案:

答案 0 :(得分:0)

querySelectorAll将返回一组节点。要使用每个节点的值,您需要像这样迭代数组

var arr_spquery = document.querySelectorAll('#spquery,#spquery1');
var spquery = '', sep='';
for(var i=0,len=arr_spquery.length; i<len; i++) {
spquery += sep + arr_spquery[i].innerHTML;
sep = ',';
}
console.log(spquery);  /* optional - to log the value */

var queryString = "?spquery=" + spquery ;
ajaxRequest.open("GET", "/the-bootstrap/ajax-ped.php" + queryString, true);
ajaxRequest.send(null);

然后在PHP脚本的服务器端,您可以根据需要使用该字符串。 :)