0

我有一个表单，我不想在第一次单击提交时提交，但第二次它应该像正常提交一样工作。所以我not-submittable在加载时向表单添加了一个类，然后在第一次单击后删除该类......（我认为）应该让它正常提交。但是，这不会发生。第一次单击按预期工作，删除类并更改按钮文本。然而，第二次点击做同样的事情。那么，我在这里缺少什么？

jQuery：

  $('form#survey_7042 #ACTION_SUBMIT_SURVEY_RESPONSE').addClass('not-submittable');

  $('form#survey_7042 #ACTION_SUBMIT_SURVEY_RESPONSE.not-submittable').click(function(event) {
      $('form#survey_7042 #ACTION_SUBMIT_SURVEY_RESPONSE').removeClass('not-submittable');
      $('form#survey_7042 #ACTION_SUBMIT_SURVEY_RESPONSE').val('Continue');
      $('form#survey_7042 #ACTION_SUBMIT_SURVEY_RESPONSE').removeAttr('disabled');
    return false;
  });

前javascript按钮：

<input type="submit" class="Button" value="Submit Survey" id="ACTION_SUBMIT_SURVEY_RESPONSE" name="ACTION_SUBMIT_SURVEY_RESPONSE">
4

4 回答 4

4

引用 OP：“我有一个表单，我不想在第一次点击提交时提交，但第二次它应该像正常提交一样工作。”

仅使用 jQuery.one()阻止第submit一次点击。

http://api.jquery.com/one/

$('#ACTION_SUBMIT_SURVEY_RESPONSE').one('submit', function(e) {
    e.preventDefault();
    // do what you need to do on first click
}

或者...

$('#ACTION_SUBMIT_SURVEY_RESPONSE').one('submit', function(e) {
    e.preventDefault();
    // do what you need to do on first click
    if ( some-condition ) {  // under certain conditions allow submit on first click
        $(this).submit();
    }
}
于 2013-02-01T16:47:54.217 回答
3

.click()尝试使用.on()and.off()方法来绑定和取消绑定事件，而不是使用。在你的情况下：

$('form#survey_7042 #ACTION_SUBMIT_SURVEY_RESPONSE.not-submittable').on("click.stopSubmit", function(event) {

    $('form#survey_7042 #ACTION_SUBMIT_SURVEY_RESPONSE').removeClass('not-submittable');
    $('form#survey_7042 #ACTION_SUBMIT_SURVEY_RESPONSE').val('Continue');
    $('form#survey_7042 #ACTION_SUBMIT_SURVEY_RESPONSE').removeAttr('disabled');

    if (...conditions are met.....) {
        $('form#survey_7042 #ACTION_SUBMIT_SURVEY_RESPONSE.not-submittable').off("click.stopSubmit");
    }

    return false;
});

您可能会注意到该.on()方法的第一个参数是处理程序的字符串表示形式，但我附加了命名空间“.stopSubmit”。命名您的处理程序允许您取消绑定一个特定的点击处理程序，而不是所有的点击处理程序。最好的部分是，如果您仍想使用原始处理程序中的代码，您可以创建一个单独的单击处理程序来运行该代码，并且当您取消绑定“.stopSubmit”处理程序时，它不会被取消绑定。

请注意.on()and.off()是推荐的绑定/取消绑定方法 - jQuery 不再推荐.bind()and .unbind()。


更新
在阅读您关于在满足某些条件之前不解除绑定的评论后，我想指出您可以.off()在条件中插入调用。我已经更新了代码以反映这一点。

于 2013-02-01T16:44:16.857 回答
1

如果有某些必须匹配的标准，请使用submitable包含您的逻辑的地方，使发送表单成为可能：

var submit = $('form#survey_7042 #ACTION_SUBMIT_SURVEY_RESPONSE');
submit.addClass('not-submittable');

submit.click(function(event) {
    if (true == submitable) {
        submit.removeClass('not-submittable').val('Continue').removeAttr('disabled');
        submit.unbind();
        event.preventDefault();
    }
});
于 2013-02-01T16:44:39.077 回答
1

你可以做这样的事情

 $(document).ready(function () {

         $('#ACTION_SUBMIT_SURVEY_RESPONSE').click(function (event) {
             if (!$('#ACTION_SUBMIT_SURVEY_RESPONSE').hasClass(".not-submittable")) {

                 //do all conditions you wish on first click

                 //if condidition meets add this class to button
                 $('#ACTION_SUBMIT_SURVEY_RESPONSE').addClass(".not-submittable");

                 //stop form submit
                 event.preventDefault();
             }
             else {

                 //calls when button have .not-submittable class may be second or any no of clicks
                 $('#ACTION_SUBMIT_SURVEY_RESPONSE').removeClass('not-submittable');
                 $('#ACTION_SUBMIT_SURVEY_RESPONSE').val('Continue');
                 $('#ACTION_SUBMIT_SURVEY_RESPONSE').removeAttr('disabled');
                 //commented return false so form submits normally
             }
         });

     });
于 2013-02-01T16:53:42.050 回答