提交按鈕無法正常工作

你好，我正在使用這段代碼。我有這個問題。當我在輸入框中輸入輸入時，它很好。但是當我按下輸入頁面刷新一秒，輸入框是自動清除。提交按鈕無法正常工作

<script> 
     function book_suggestion() { 
      var book = document.getElementById("book").value; 
      var xhr; 
      if (window.XMLHttpRequest) { 
       xhr = new XMLHttpRequest(); 
      } else if (window.ActiveXObject) { 
       xhr = new ActiveXObject("Microsoft.XMLHTTP"); 
      } 
      var data = "book_name=" + book; 
      xhr.open("POST", "book-suggestion.php", true); 
      xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); 
      xhr.send(data); 
      xhr.onreadystatechange = display_data; 

      function display_data() { 
       if (xhr.readyState == 4) { 
        if (xhr.status == 200) { 
         document.getElementById("suggestion").innerHTML = xhr.responseText; 
        } else { 
         alert('There was a problem with the request.'); 
        } 
       } 
      } 
     } 
    </script>

來源

2013-04-16 user2287588

小片的信息;正確包裝你所有的標籤屬性的報價:) – 2013-04-16 18:20:35

您的頁面重新加載的原因是因爲<form>元素趕上進入印刷機。

抓住一個輸入新聞界將提交表格。

提交沒有action=""屬性的表單將提交到同一頁面。

提交到一個不處理請求的頁面將會簡單地重新加載頁面，並且您的表單輸入將被重置爲空白。

要解決此問題，請通過使用javascript捕獲等於13的按鍵來禁用submit-on-enter，並返回false或取消該事件。

<input type=text id=book onKeyUp="book_suggestion(event)"> 

... [snip] ... 

function book_suggestion(e){ 
    if(e.which == 13){ 
     e.preventDefault(); 
     e.stopPropagation(); 
     return false; 
    } 

    ... [snip your code] ...

這應該做的伎倆。

對於什麼是值得的，堆棧溢出的人通常不喜歡根據您的請求修改您的代碼。這是一個簡單的修復方法，可以通過Google搜索關鍵字（「catch keypress」，「cancel event」等）找到。

來源

2013-04-16 18:13:34 rockerest

好的感謝您的快速回答:)請問您kindle修改代碼...請... – user2287588

使用此代碼 ''ididn't work :( – user2287588

如果我理解你，你想提交自己的表單數據。您應該在book_suggestion()函數內返回false。並將onsubmit添加到<form>元素。確保它應該有返回。像這樣：

<form onsubmit="return book_suggestion();">

來源

2013-04-16 20:48:13 Ikrom

謝謝，但沒有工作:( – user2287588

提交按鈕無法正常工作

回答

相關問題