使用Ajax传递Json变量并解码

时间:2014-05-19 05:57:55

标签: javascript php jquery ajax json

我有一个以前使用的AJAX脚本,并且能够从viewCommentsJson.php检索[{"comments":"Greta"},{"comments":"John"}]的数据。<a onclick="showUser('.$row['ID'].')" method = "POST" action= "viewCommentsJson.php">Show Comments</a> <script> 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("Post","viewCommentsJson.php?q="+str,true); xmlhttp.send(); } </script> 。我想知道它是否能够解码返回值以便正确显示它?

提前致谢

  

Greta
John

Main.php

$com = $_REQUEST["q"];

include 'connectDatabase.php';
//opening sql table
$selected = mysql_select_db("2000",$dbhandle) 
  or die("Could not select 2000");
$arr = array();
$data = mysql_query("SELECT comments FROM comment WHERE ID = '$com'");

$rows = array();
while($r = mysql_fetch_assoc($data)) {
    $rows[] = $r;
}
print json_encode($rows);

viewCommentsJson.php

{{1}}

2 个答案:

答案 0 :(得分:1)

由于您不介意jQuery解决方案,以下是如何完成的

function showUser(str) {
      if (str=="") {
        document.getElementById("txtHint").innerHTML="";
        return;
      } 
      $.ajax({
          type:'post',
          url: 'viewCommentsJson.php',
          data:{q:str},
          success:function(data)
          {
              data = $.parseJSON(data);
              var response;
              $.each(data, function(index, value){
                   response += value+'<br />';
              });
              $('#txtHint').html(response);
          }
      });
}

您可以参考$.ajax$.parseJSON了解详情。

注意:您的SELECT comments FROM comment WHERE ID = '$com'容易出现SQL注入。至少,您应该直接清理所有传入数据,然后再直接在查询中使用它。

答案 1 :(得分:1)

<a onclick="showUser('1')" href="#?">Show Comments</a>

<script>
    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) {
          data = eval(xmlhttp.responseText);
          for(i=0;i<data.length;i++){
             document.getElementById("txtHint").innerHTML = document.getElementById("txtHint").innerHTML + data[i].comments;
          }          
        }
      }
      xmlhttp.open("Post","viewCommentsJson.php?q="+str,true);
      xmlhttp.send();
    }
</script>
<div id="txtHint"></div>

首先从A标签中删除方法和操作,然后在上面的代码中使用。删除了一些拼写错误