Question

我正在尝试提交没有按钮点击或页面刷新的表单。提交表单后，我将通过php回显输入字段中的值。问题是我添加了一个计时器，但根本没有做任何事情。一旦用户停止输入，我如何设置一个计时器给两秒钟（键盘），然后取值？ EXAMPLE

JS

<script>
$(function() {

var timer;

$(".submit").click(function() {

  $('submit').on('keyup', function() {

    var name = $("#name").val();


    var dataString = 'name='+ name;


            $.ajax({
            type: "POST",
            url: "index.php",
            data: dataString,
            success: function(result){
            /*$('.success').fadeIn(200).show();
            $('.error').fadeOut(200).hide();*/
            $('#special').append('<p>' +  $('#resultval', result).html() + '</p>');

                }

           });
            return false;
});

}, 2000;


});
</script>

PHP

 <?php
 if($_POST){
     $url     = $_POST['name'];
     echo ('<b><span id="resultval">'.$url.'</span></b>');
    }
 ?>

Answer 1

http://jsfiddle.net/earlonrails/pXA6U/2/

$(function() {
 var timer = null; 
 var dataString;
 function submitForm(){
   alert("success");
   $.ajax({ type: "POST",
            url: "index.php",
            data: dataString,
            success: function(result){
              alert("success");
            }

   });
   return false;
 }
 $('#submit').on('keyup', function() {
    clearTimeout(timer);
    timer = setTimeout(submitForm, 2000);
    var name = $("#name").val();
    dataString = 'name='+ name;
 });

});

Answer 2

我使用以下内容提供带有可视化计时器的自动刷新页面。它比你需要的更多，但它可以被剥离回更简单的东西。

使用

在页面加载时启动它

auto_refresh();

支持以下功能

/**
 * This function checks if the auto-refresh check box is checked and then refreshes the page.
 *
 *
 */
 function auto_refresh() {
    // ****************************************
    //           Countdown display
    // **************************************** 
    $("#countdown").progressbar({ value: 100 });
    check_refresh(120, 120);
    $("#autorefresh").click(function() {
            if ($(this).attr("checked") == "checked") {
                $("#countdown").progressbar("option", "disabled", false );
                $("#countdown").progressbar("option", "value", 100);
                check_refresh(120, 120);
            } 
        });
 }

和...

/**
 * This functions sets the time interval used to auto-refresh the page.
 */
function check_refresh(countdownValue, secondsRemaining) {
    var autorefresh = $("#autorefresh");

    if ($(autorefresh).attr("checked") == "checked") {      
        setTimeout(function() {
            var value = Math.round(secondsRemaining / countdownValue * 100);
            // consoleDebug("Seconds remaining: " + secondsRemaining);
            secondsRemaining -= 10;
            $("#countdown").progressbar("option", "value", value);
            if (secondsRemaining < 0) {
                loadDashboard();  // <--- Launch whatever you want here.
                check_refresh(120, 120);
            } else {
                check_refresh(countdownValue, secondsRemaining);
            }
        }, 10000);
    } else {
        $("#countdown").progressbar({ disabled: true });
    }
}

JS / Ajax：提交表单而不刷新页面或点击按钮

2 个答案: