Question

所以我有一个联系表单。当我点击提交按钮时，如果我使用.click（），它会重置表单。但是，当我使用.submit（）时，由于某种原因它不起作用。

以下是表单的代码。

<form id="foo">
        <div class="form_sides"> 
          <div class="form-group">
            <label for="Your_Name">Name</label>
            <input type="text" class="form-control" name="name" id="name" aria-describedby="nameHelp" placeholder="" required>
          </div>
          <div class="form-group">
            <label for="Your_Email">Email</label>
            <input type="email" name="email" class="form-control" id="email" placeholder="" required>
          </div>
          <div class="form-group">
            <label for="Your_Subject">Subject</label>
            <input type="text" name="subject" class="form-control" id="subject" placeholder="" required>
          </div>
        </div>
        <div class="form_sides">
          <div class="form-group">
            <label for="Your_Phone">Message</label>
            <textarea class="form-control" id="message" name="message" rows="3" required></textarea>
          </div>
          <div class="form-group">
            <div id='success'></div>
            <button id="btn_submit" type="submit" class="btn_submit">Submit</button>
          </div>
        </div>
      </form>

这是我的JavaScript

var reset = function(){
    setTimeout(function(){
        $('form')[0].reset();
    },3000);
}
$('.btn_submit').on('submit', function(){
    reset();
    console.log("debug");
});

在这里，我没有得到console.log，但是在.click（）上我得到了console.log。表单正在提交给Google Spread Sheet。另外，看着它，如果你们可以告诉我如何使重置更顺畅，那就太好了。我希望价值淡出而不是输入框。

提前致谢，

Answer 1

如果要附加到提交事件，则必须将其附加到实际表单。如果要在单击时执行此操作，可以附加到按钮。但是，您无法执行按钮的提交事件。

改变：

$('.btn_submit').on('submit', function(){
    reset();
    console.log("debug");
});

是：

$('#foo').on('submit', function(){
    reset();
    console.log("debug");
});

或者，您可以附加按钮的click事件并使用以下代码：

$('.btn_submit').on('click', function(){
    reset();
    console.log("debug");
});

单击提交后重置表单

1 个答案: