jQuery AJAX：意外的輸入結束

我想檢查使用AJAX的輸入值。每次用戶按一個鍵AJAX發送，然後根據服務器的結果我添加有效或無效的類到輸入。jQuery AJAX：意外的輸入結束

的.js：

$("input[name=username]").keyup(function(event) { 
    processAJAXCheck(this,"username"); 
}); 

$("input[name=username]").change(function(event) { 
    processAJAXCheck(this,"username"); 
}); 

function processAJAXCheck(element, toCheck) { 
    contentOfInput = $(element).val(); 

    $.ajax({ 
     url: "ajax.php", 
     type: "POST", 
     data: {content: contentOfInput, toCheck: toCheck}, 
     success: afterAJAXResponse 
    }); 
} 

function afterAJAXResponse(data) { 
    result = $.parseJSON(data); 

    if(result['toCheck'] != undefined) { 
     inputSelector = 'input[name='+result['toCheck']+']'; 
     if(result['result'] == true) { 
      $(inputSelector).removeClass('invalid'); 
      $(inputSelector).addClass('valid'); 
      formValid = true; 
     } else { 
      $(inputSelector).removeClass('valid'); 
      $(inputSelector).addClass('invalid'); 
      formValid = false; 
     } 
    } 

    result = null; 
}

PHP代碼：

if(isset($_POST['toCheck']) && isset($_POST['content']) 
    && $_POST['toCheck'] != "" && $_POST['content'] != "") 
{ 
    require_once 'classes/AAA.php'; 
    require_once 'classes/Database.php'; 
    require_once 'etc/settings.php'; 

    $db = new Database($GLOBALS['db_server'],$GLOBALS['db_name'],$GLOBALS['db_user'],$GLOBALS['db_pass']); 
    $aaa = new AAA($db); 

    switch($_POST['toCheck']) 
    { 
     case 'email': 
      $output['result'] = $aaa->isUsableEmail($_POST['content']); 
      $output['toCheck'] = 'email'; 
      break; 
     case 'username': 
      $output['result'] = $aaa->isUsableUsername($_POST['content']); 
      $output['toCheck'] = 'username'; 
      break; 
     default: 
      $output['result'] = 'error'; 
      break; 
    } 

    echo json_encode($output); 
}

奇怪的是，當我按下任意字符鍵一切正常，沒有任何問題。但是，當我按「TAB」切換到另一個輸入（它使用相同的功能，但不返回任何錯誤 - 也當我按下Tab鍵在那裏！）我得到以下錯誤：

Uncaught SyntaxError: Unexpected end of input b.extend.parseJSON 
jquery-1.9.1.min.js:3 afterAJAXResponse 
registration.php?school_id=1&department_id=1:189 b.Callbacks.c 
jquery-1.9.1.min.js:3 b.Callbacks.p.fireWith jquery-1.9.1.min.js:3 k 
jquery-1.9.1.min.js:5 b.ajaxTransport.send.r

感謝您預先回應。

來源

2014-11-04 Honza Kopecky

添加數據類型：「JSON」 – 2014-11-04 21:26:10

我不認爲這是在這段代碼引起問題，但你應該用'var'，例如聲明局部變量'var contentOfInput = ...' – Barmar 2014-11-04 21:27:54

@ADASein如果他這樣做，他必須刪除顯式調用'$ .parseJSON'。 – Barmar 2014-11-04 21:29:05

謝謝大家的意見！

最後，將數據類型添加到$ .AJAX（）幫助！我添加了dataType：'json'到AJAX調用中，並從回調中刪除了.parseJSON（），並且我不再遇到任何錯誤。

再次感謝你這麼多@ADASein

來源

2014-11-07 14:30:56

我假設你不想在按Tab鍵的時候調用你的ajax函數。但是，您並未檢查該選項，並且keyup也捕獲了您的選項卡點擊事件。

你應該改變：

$("input[name=username]").keyup(function(event) { 
    processAJAXCheck(this,"username"); 
});

喜歡的東西：

$("input[name=username]").keyup(function(event) { 
    if (event.keyCode !== 9) { // I think it's 9... 
    processAJAXCheck(this,"username"); 
    } 
});

您還可以添加進 - 13 - 例如。

來源

2014-11-04 21:33:55 jeroen

我不介意我是否在「TAB動作」上檢查它，因爲它會被.change偵聽器檢查。我只是想防止這個錯誤。 – 2014-11-06 06:20:03

您可以檢查Jeroen描述的關鍵代碼（這會節省您對服務器的調用），或者在檢查結果爲false時從PHP腳本返回空數組（json編碼）。

來源

2014-11-04 21:46:16 Barry

你說得對，我沒有足夠的檢查php，看看沒有任何迴應，如果第一個條件沒有得到滿足。無論使用我的解決方案，總是應該完成。 – jeroen 2014-11-04 21:50:04

@jeroen最後，Honza現在有足夠的選項/指針來解決客戶端和服務器端的問題:)。 – Barry 2014-11-04 21:55:55

jQuery AJAX：意外的輸入結束

回答

相關問題