javascript - 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()はあなたの問題をうまく解決できると思います。