表单提交答案

【问题标题】：form submit表单提交
【发布时间】：2011-04-04 05:55:41
【问题描述】：

在这个函数中，根据输入的值，表单提交是真/假。为什么 return true 不能在这个函数中工作？

基本上，我的 if 语句测试表单输入中的问号。如果有，那么我不希望表单提交给 search.php。如果问号不存在，else 语句，那么我希望表单提交到 search.php。我尝试使用 return true;使 .form1 提交，但它没有用。然后我尝试了 $('.form1').submit()，但这使它在输入之前提交。

                <script>

            $(".askInput").keyup(function() {

                if ($(this).val().indexOf("?") != -1) {

                    $(this).css({"color" : "#00bfff", 'border-top-right-radius' : '0px', 'border-bottom-right-radius' : '0px', '-moz-border-top-right-radius' : '0px', '-moz-border-bottom-right-radius' : '0px', '-webkit-border-top-right-radius' : '0px', '-webkit-border-bottom-right-radius' : '0px'});

                    $('.searchEnter').stop().animate({
                    marginLeft: "310px"
                    }, 200 );
                    $('.form1').submit(function () {
                         return false;
                        });


                } else {

                    $(this).css({"color" : "#333", 'border-top-right-radius' : '5px', 'border-bottom-right-radius' : '5px', '-moz-border-top-right-radius' : '5px', '-moz-border-bottom-right-radius' : '5px', '-webkit-border-top-right-radius' : '5px', '-webkit-border-bottom-right-radius' : '5px'});

                    $('.searchEnter').stop().animate({
                        marginLeft: "250px"
                        }, 200 );
                    $('.form1').submit(function () {
                         return true;
                        });

                }
            });

            </script>

【问题讨论】：

预期的结果是什么以及“它不起作用”如何？
预期结果是，否则，表单 .form1 应该提交。所以这是行不通的。相反，它继续不提交。它基本上就像 else 语句中的所有内容一样，除了这个： $('.form1').submit(function () { return true; });
[jquery] form submit 的可能重复项

标签： javascript jquery forms submit

【解决方案1】：

与其不断更改表单的提交处理程序，不如在提交时检查问号？

$('.form1').submit(function () {
  if ($('.askInput').val().indexOf("?") != -1) return false;
});

$(".askInput").keyup(function () {

  if ($(this).val().indexOf("?") != -1) {

    $(this).css({
      "color": "#00bfff",
      'border-top-right-radius': '0px',
      'border-bottom-right-radius': '0px',
      '-moz-border-top-right-radius': '0px',
      '-moz-border-bottom-right-radius': '0px',
      '-webkit-border-top-right-radius': '0px',
      '-webkit-border-bottom-right-radius': '0px'
    });

    $('.searchEnter').stop().animate({
      marginLeft: "310px"
    }, 200);
  } else {

    $(this).css({
      "color": "#333",
      'border-top-right-radius': '5px',
      'border-bottom-right-radius': '5px',
      '-moz-border-top-right-radius': '5px',
      '-moz-border-bottom-right-radius': '5px',
      '-webkit-border-top-right-radius': '5px',
      '-webkit-border-bottom-right-radius': '5px'
    });

    $('.searchEnter').stop().animate({
      marginLeft: "250px"
    }, 200);
  }
});

【讨论】：

啊，如果是经常的话，我更喜欢。
你是老板。这个网站上唯一可以解决这个问题的人......尤其是我对 jquery 的糟糕理解......非常感谢，你创造了这一天！

【解决方案2】：

试试看。

$('.form1').submit(function (e) {
  if ($('.askInput').val().indexOf("?") != -1) {
    e.preventDefault();
  }
  $(this).submit();
});

【讨论】：

如果我使用它，它会在 else 上提交（这很好），但它也会开始在 if 上提交（这不好）。

【解决方案3】：

使用不带任何参数的submit：$('.form').submit()

【讨论】：

这使它在用户点击进入之前提交。我需要它在用户按下回车时提交。

【解决方案4】：

$('.form1').submit(function () {
    return true;
});

这会将只返回true 的函数绑定到submit 事件。 IE。在此之后，当您提交表单时，该函数将返回true。就是这样。

这是manual entry：

.submit( handler(eventObject) )
handler(eventObject) 每次触发事件时执行的函数。

如果您只想提交表单，请使用$('.form1').submit()。如果您不想提交表单，请不要致电.submit()。即：

if (...) {
    ...
    // don't call submit
} else {
    ...
    $('.form1').submit();
}

【讨论】：

好的，等等，我希望函数不在“if”上提交，而是在“else”上提交。因此，如果该函数未在 if 上提交（这是我希望它执行的操作），我该如何让它改为在 else 上提交。
@hubrid 只需不要在“if 条件”中提交表单，不要致电.submit()。调用.submit() 提交表单，不调用它不会。当您要提交表单时，仅在“else 条件”中调用.submit()。
$('.form1').submit();这使得它在用户点击进入之前提交。
@hubrid 我认为你需要澄清你想要发生的事情。
哈哈哈好的。基本上，我的 if 语句测试表单输入中的问号。如果有，那么我不希望表单提交给 search.php。如果没有问号，else 语句，那么我希望表单提交到 search.php。我尝试使用 return true;使 .form1 提交，但它没有用。然后我尝试了 $('.form1').submit()，但这使它在按下输入之前提交。

【解决方案5】：

我认为您想在 askInput 条目无效时阻止表单提交。

当您将提交处理程序绑定到表单时，它始终是附加的，因此每次运行您的 keyUp 处理程序时，您都会向表单添加一个额外的提交处理程序。其中之一必然会“返回 false”，从而阻止表单提交。

相反，可以禁用提交按钮或向表单添加“无效”类并添加单个表单提交处理程序，以确保表单没有无效类。

例如：

<form>
  <input name="ask" /> <input type="submit" />
</form>
<script>
$('form').submit(function(e) {
  if ($(this).hasClass('invalid')) {
    e.preventDefault();
  }
});
$('input[name="ask"]').keyup(function(e) {
  if ($(this).val().indexOf("?") != -1) {
    // ...

    $(this.form).addClass('invalid');
    // or
    $(':submit', this.form).attr('disabled', 'disabled');
  } else {
    // ...

    $(this.form).removeClass('invalid');
    // or
    $(':submit', this.form).removeAttr('disabled');
  }
});
</script>

或者，使用久经考验的 jQuery 验证库，例如 jQuery ketchup。

【讨论】：

无论如何我可以通过更改表单来提交/刷新页面并且不提交/不刷新页面吗？
这就是上面的代码示例所做的。你想提交什么时候“？”输入了吗？如果是这样，只需使用：$('input[name="ask"]').keyup(function(e) { if ($(this).val().indexOf("?") != -1) { $(this.form).submit(); } });
是的，问题是，使用 $(this.form).submit();，表单在用户按下 Enter 之前提交。它会实时提交......如果这有意义的话。

【解决方案6】：

Blender 试图告诉你的是（在所有 jQuery 魔法中，如果你喜欢那种东西的话）是为表单的提交事件添加一个监听器，它查看输入并返回 false 如果有 ?那里。简单来说，POJS 术语：

<form onsubmit="return validateInput(this);">
  <input name="foo" value="?">
  <input type="submit">
</form>

<script type="text/javascript">
  function validateInput(form) {

    if (/\?/.test(form.foo.value)) {
      // value has a ?, ask user to fix it
      alert('Get rid of ? knucklehead!!');

      // cancel submit
      return false;
    }
  }
</script>

【讨论】：