Uncaught ReferenceError：（函數）沒有在HTMLButtonElement.onclick處定義

我有一個搜索表單，我試圖讓它在頁面底部輸出結果而不重新加載。Uncaught ReferenceError：（函數）沒有在HTMLButtonElement.onclick處定義

<form action='' method='post'> 
<div id="search-form">  
<input type="text" name="search" class="search-field" id="search" value="" /> 
<div class="submit-container"> 
<button type="button" value="" class="submit" id="searchbutton" onclick="searchoutput()" /></button> 
      </div> 
    </form> 
    <br><br> 
    <p>Type First Name</p>

我希望在單擊按鈕時使用對其他腳本的Ajax調用來顯示搜索結果。我不斷收到一個錯誤：「未捕獲的ReferenceError：searchoutput不是在HTMLButtonElement.onclick

這裏定義爲我的javascript（使用jquery）：

$(document).ready(function() { 
function searchoutput() { 
    if($(".search-field").val().length > 5) { //only shows results when more than 5 characters have been entered 
     var search = $(".search-field").val(); 
     var update = $(".result"); 
     var goal = 0; 
     $.get("query-include.php" , {search: search, goal: goal}) 
     .done(function(data) { 
      update.empty(); 
      update.append(data); 
      $(this).remove(); 
           }); 
              }; 
         } 
    $(".search-field").keydown(function() { 
     var update =$(".results"); 
     update.empty(); 
             }); 
          });

我檢查了其他帖子，花了很長一段時間試圖讓我自己解決奇怪的是，如果我添加的事件偵聽器「KEYUP」爲了運行相同的功能searchoutput按照用戶類型：

var searchfield = document.getElementById("search"); 
searchfield.addEventListener("keyup", searchoutput);

然後我沒有得到ReferenceError和腳本運行正常..我只得到按鈕單擊功能問題。

來源

2017-01-07 Daniel C

這是一個範圍界定問題 - searchOutput定義在$(document).ready()函數的範圍內。你可以嘗試的是，代碼之前聲明VAR爲searchOutput，然後將其分配給這樣的功能：）

var searchOutput; 
$(document).ready(function() { 
    searchOutput = function() { 
    if($(".search-field").val().length > 5) { 
    //etc.

來源

2017-01-07 23:21:56 hackerrdave

現在的問題雖然是KEYUP事件偵聽不再火災。我認爲，因爲你在你的例子中改變了第3行以將函數分配給searchoutput變量，而eventlistener keyup運行searchoutput函數，現在它不能再找到該函數。你能提出一個替代方案嗎？ –

哦gotcha - addEventListener被調用了嗎？ – hackerrdave

在文檔準備好之後的第一行上，剛剛在函數 –

我searchoutput的位置添加一個事件監聽（;

$(document).ready(function() { 
 
    $('.submit').addEventListener('click', function(){ 
 
    if($(".search-field").val().length > 5) { //only shows results when more than 5 characters have been entered 
 
     var search = $(".search-field").val(); 
 
     var update = $(".result"); 
 
     var goal = 0; 
 
     $.get("query-include.php" , {search: search, goal: goal}) 
 
     .done(function(data) { 
 
      update.empty(); 
 
      update.append(data); 
 
      $(this).remove(); 
 
      
 
           }); 
 
              } 
 
         }); 
 
    $(".search-field").keydown(function() { 
 
     var update =$(".results"); 
 
     update.empty(); 
 
             }); 
 
          });

來源

2017-01-07 23:38:23 liontass

Uncaught ReferenceError：（函數）沒有在HTMLButtonElement.onclick處定義

回答

相關問題