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

我正在尝试提交一个没有按钮点击或页面刷新的表单。提交表单后，我将通过php在输入字段中回显值。问题是，我添加了一个计时器，但什么也没做。当用户停止键入时，我如何设置计时器？请给出两秒（keyup）然后获取值

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>

$（函数（）{
无功定时器；
$（“.submit”）。单击（函数（）{
$（'submit'）。在（'keyup'，function（）上{
var name=$（“#name”）.val（）；
var dataString='name='+name；
$.ajax({
类型：“POST”，
url:“index.php”，
数据：dataString，
成功：功能（结果）{
/*$（'.success'）.fadeIn（200.show（）；
$（'.error'）.fadeOut（200.hide（）*/
$（“#特殊”）.append（“”+$（“#resultval”，result.html（）+”
）；
}
});
返回false；
});
}, 2000;
});

PHP

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

---

我使用下面的方法来提供一个带有可视计时器的自动刷新页面。它的功能超出了您的需要，但可以精简为更简单的功能

在页面加载时使用

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 });
    }
}

/**
*此函数用于设置用于自动刷新页面的时间间隔。
*/
功能检查\u刷新（倒计时值，秒维护）{
var自动刷新=$（“自动刷新”）；
如果（$（自动刷新）.attr（“已检查”）==“已检查”）{
setTimeout（函数（）{
var值=数学四舍五入（秒保留/倒计时值*100）；
//控制台错误（“剩余秒数：+secondsRemaining”）；
二次维护-=10；
$（“#倒计时”）.progressbar（“选项”、“值”、“值”）；
如果（秒保持<0）{
loadDashboard（）；//

​
 什么是
var定时器；
和
}，2000；
？在我看来，你似乎在寻找一个
设置间隔
。你为什么要在单击函数中进行键控？这会发生吗？从可用性和可访问性的角度来看，这真是个糟糕的主意。+1谢谢，它在JSFIDLE中工作得非常好。我复制粘贴到我的示例中，但没有得到任何结果或成功消息。我甚至添加了
$（文档）。准备好了
，但没有启动任何程序。您可以检查
$(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;
 });

});