從PHP返回的jQuery JSON

Question

我有一個簡單的HTML form ，用戶可以從數據庫中搜索單詞，如果單詞在數據庫中，則PHP作為JSON對象返回結果。

奇怪的是，當用戶通過單擊按鈕而不是按Enter鍵進行搜索時，將為數據庫中的單詞返回JSON對象。 當用戶按下Enter鍵或單擊按鈕進行搜索時，我具有以下兩個功能要處理。 當用戶在文本字段中鍵入單詞后通過按Enter鍵進行搜索時，如何改進我的代碼以從PHP獲取JSON對象？

$('#word-submit').on('click', function() {
  var word = $('#word').val();
  $.post('ajax/name.php', {word: word}, function(data) {
    var obj = jQuery.parseJSON(data);
    console.log(obj); //I see the object in Chrome console log.
  });

});

$('#word').keypress(function(e) {
  if (e.which == 13) {
    var word = $('#word').val();
    $.post('ajax/name.php', {word: word}, function(data) {
      var obj = jQuery.parseJSON(data);
      console.log(obj); //No object is return here. Why? May be something is wrong in my code.
    });
  }
});

<html>

<head>
  <title>Welcome</title>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <link rel="stylesheet" type="text/css" href="style.css">
</head>

<body>
  <div id="container">
    <form>
      <input type="text" id="word">
      <input type="button" id="word-submit" value="Search">

    </form>


    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
    <script src="js/global.js" charset="UTF-8"></script>
</body>

</html>

PHP腳本可以正常工作。 所以我不在這里粘貼。

Answer 1

問題很可能是您的表單正在提交。 我只是在表單的Submit事件上添加一個偵聽器，該事件應該處理單擊按鈕並單擊Enter的行為 ，例如

$(form).on('submit', function(e) {
    e.preventDefault(); // don't submit
    var word = $('#word').val();
    $.post('ajax/name.php', {word: word}, function(data) {
        console.log(data);
    }, 'json');
});

理想情況下，您不必解析JSON，甚至不必告訴jQuery響應數據類型（請參見上面的'json' json'arg）。 確保您的PHP腳本具有以下內容...

header('Content-type: application/json');
echo json_encode($someDataArrayOrObject);
exit;

為了使按鈕與上面的按鈕兼容，請將其類型更改為submit ，即

<input type="submit" id="word-submit" value="Search">

Answer 2

按鈕工作，因為它阻止了表單自動提交/自行重新加載。

在該文本框上按Enter鍵，導致表單提交，然后自行重新加載，甚至不觸發$('#word').keypress(function(e)) 。

從PHP返回的jQuery JSON

問題描述

2 個解決方案

解決方案1
1 已采納 2015-03-27 02:10:11

解決方案2
0 2015-03-27 02:20:37

從PHP返回的jQuery JSON

問題描述

2 個解決方案

解決方案1 1 已采納 2015-03-27 02:10:11

解決方案2 0 2015-03-27 02:20:37

解決方案1
1 已采納 2015-03-27 02:10:11

解決方案2
0 2015-03-27 02:20:37