单击ajax禁用提交按钮,然后再次启用

时间:2018-11-29 07:27:40

标签: javascript ajax

您好,我所有的功能都很棒,但是问题不大

 $(document).ready(function(){
$("input[type='submit']").attr("disabled", false);
$("form").submit(function(){
  $("input[type='submit']").attr("disabled", true).val("Please wait.");
    setTimeout(function(){
    $("input[type='submit']").attr("disabled", false).val("Submit");    
}, 3*1000);
  return true;
})
})

问题是,当我在页面中有2个表单时,它会更改所有提交按钮的值,我只希望仅针对单击的按钮而不是针对所有提交按钮才能激活该功能。

我希望你明白我的意思。我知道我需要修改函数中的某些内容,但是这样做会遇到一些问题...

1 个答案:

答案 0 :(得分:1)

使用this引用当前提交的表单,然后可以使用.find获取该表单的后代submit输入:

$("form").submit(function(){
  const input = $(this)
    .find("input[type='submit']")
    .attr("disabled", true)
    .val("Please wait.");
  setTimeout(function(){
    input
      .attr("disabled", false)
      .val("Submit");    
  }, 3*1000);
  return true;
});

还请注意,除非您使用的是旧版的jQu​​ery,否则您可能应该首选.prop over .attr