javascript - 悬停2秒后提交表单

Question

我试图弄清楚如何设置时间，当用户将鼠标悬停在提交按钮上时，表单将被提交（2 秒）。

$(document).ready(function(){
  $("#submit95").hover(function(){
    var form95 = $("#form_sub_category_id95");
    $("#form_sub_category_id95").ajaxSubmit({
      target: "#output110",
      data: form95.serialize(),
      success: function (data) {
        $("#product_default110").hide();
        $("#output110").html(data);
      }
    });
  });
});

Answer 1

$(document).ready(function(){
    $("#submit95").hover(function(){ 
        timer = setTimeout(function(){
        var form95 = $("#form_sub_category_id95");
        $("#form_sub_category_id95").ajaxSubmit( {
           target: "#output110", 
           data: form95.serialize(),
           success: function (data) {
                    $("#product_default110").hide();
                    $("#output110").html(data);     
                }
        });
        },2000);
    },function(){
        clearTimeout(timer); //when mouseout stop 
    });
});

Answer 2

您可以setTimeOut()为此使用：

setTimeout() 方法在指定的毫秒数后调用函数或计算表达式。

将此代码写入另一个函数

function callAfterSomeTime() {
  var form95 = $("#form_sub_category_id95");
  $("#form_sub_category_id95").ajaxSubmit({
    target: "#output110",
    data: form95.serialize(),
    success: function (data) {
      $("#product_default110").hide();
      $("#output110").html(data);
    }
  });
}

Answer 3

尝试这个

$(document).ready(function(){
        $("#submit95").hover(function(){ 
            setTimeout(function(){
            var form95 = $("#form_sub_category_id95");
            $("#form_sub_category_id95").ajaxSubmit( {
               target: "#output110", 
               data: form95.serialize(),
               success: function (data) {
                        $("#product_default110").hide();
                        $("#output110").html(data);     
                    }
            });
            },2000);
        });
    });

Answer 4

执行以下操作：

$(document).ready(function() {
  $("#submit95").hover(function() {
    setTimeout(doSubmit, 2000);
  }
);

function doSubmit() {
  var form95 = $("#form_sub_category_id95");
  $("#form_sub_category_id95").ajaxSubmit( {
     target: "#output110", 
     data: form95.serialize(),
     success: function (data) {
              $("#product_default110").hide();
              $("#output110").html(data);     
          }
     });
  });
}

Answer 5

使用超时延迟提交并在 mouseleave 上取消它：

$('form').hover(function(){
     $(this).data('t', setTimeout(submitFn, 2000));
}, function(){
     clearTimeout($(this).data('t'));
});