代码之家  ›  专栏  ›  技术社区  ›  Bitwise

禁用单击“停止表单提交”按钮

  •  3
  • Bitwise  · 技术社区  · 7 年前

    我试图在用户单击按钮后禁用它。我有这个功能的工作很好,但现在的形式不会提交。。。以下是我的javascript:

    <script>
      $('.button').on('click', function(event) {
        $(this).prop('disabled', true);
      });
    </script>
    

    这再次很好地禁用了按钮,但现在我的表单无法提交。这是一个众所周知的问题吗?

    3 回复  |  直到 7 年前
        1
  •  0
  •   Alex Kudryashev    7 年前

    而不是把它放在 click handler,把它放到表单的 submit 处理程序。

    $('form').on('submit', function(event) {
      $(this).find(".button").prop('disabled', true);
    });
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <form>
      <button class="button">Submit</button>
    </form>
        2
  •  2
  •   Barmar    7 年前

    Click 事件发生在窗体之前 submit disabled 按钮阻止提交。这是一个解决办法:

    <script>
      $('.button').on('click', function(event) {
        $this=$(this);
        setTimeout(function(){$this.prop('disabled', true);},50);
      });
    </script>
    

    另一个解决方法是处理 $('form').on('submit',function(){...});

    编辑:。。。相反

        3
  •  0
  •   Vitalii    7 年前
    <script>
      $('.button').on('click', function(event) {
        $(this).prop('disabled', true);
        $(this).parents('form').submit();
      });
    </script>