JS/AJAX：使用計時器提交表單而不是按鈕單擊或刷新頁面

Question

我試圖提交沒有頁面刷新或提交按鈕的表單。但我只實現了JS功能提交輸入框值。是否可以在沒有按鈕點擊和刷新頁面的情況下提交整個表單？

JSFIDDLE

JS

  <script type="text/javascript"> 
       $(document).ready(function() { 
        var timer; 
         $('#yurl).on('keyup', function() { 
          var value = this.value; 

          clearTimeout(timer); 

          timer = setTimeout(function() { 

           //do your submit here 

           alert('submitted:' + value); 
          }, 2000); 
         }); 
       }); 
      </script> 

HTML

   <form method="post" id="ytVideo" action=""> 
       <input id="yurl" type="text" value="<?php $url ?>" name="yurl">  
       </form> 

Answer 1

你的小提琴似乎在工作，但問題是你並沒有真的在任何地方提交它。

<script type="text/javascript"> 
$(document).ready(function() { 
         var timer; 
          $('#yurl).on('keyup', function() { 
           var value = this.value; 

           clearTimeout(timer); 

           timer = setTimeout(function() { 

            //do your submit here 
            $("#ytVideo").submit() 
            alert('submitted:' + value); 
           }, 2000); 
          }); 


    //then include your submit definition. What you want to do once submit is executed 
     $('#ytVideo').submit(function(e){ 
      e.preventDefault(); //prevent page refresh 
      var form = $('#ytVideo').serialize(); 
      //submit.php is the page where you submit your form 
      $.post('submit.php', form, function(data){ 
       //do something with the data 

      }); 
     }); 

}); 
</script> 

Answer 2

如果我深知你的要求，在那裏說//do your submit here你應該把：

$("#ytVideo").submit() 

其中ytVideo是表單的id你想提交

祝你好運！

Answer 3

我覺得jQuery.serialize()可以很好地解決您的問題。