jquery通过单击复选框提交表单不起作用答案

【问题标题】：jquery submit form by clicking checkbox doesn't workjquery通过单击复选框提交表单不起作用
【发布时间】：2014-09-05 13:06:00
【问题描述】：

单击复选框时，应提交表单，但这不会发生。一个简单的警报（作为测试）确实有效。哪里出错了？

HTML

<form id="formId" name="formName" action="index.php" method="post">
<input name=entry>
<input type="checkbox" class="checkbox1">1
<input type="checkbox" class="checkbox2">2
<input type="checkbox" onclick="this.form.submit();">5
<input type="submit" name="submit" >
</form>

<script type="text/javascript">

$(document).ready(
  function(){ 
    $(".checkbox1").click(
        function(){ 
            alert('checkbox 1 clicked'); 
        }
    )
    $(".checkbox2").click(
        function(){ 
            $('#formId').submit();
        }
    )
    }
);
</script>

【问题讨论】：

我还没有看到你添加了任何 jquery 库。你是吗？
我有点疑惑你是怎么让警报工作的？编写代码的方式都不应该工作。在假设我的答案正确之前，我将等待更新（您可能刚刚遗漏了其余代码）。
这有点奇怪（仍在寻找）。我的解决方法（如下）是在单击复选框时触发提交按钮。提交就好了。

标签： jquery forms

【解决方案1】：

忽略下面的第一个问题，我可以看到您的表单不会通过提交按钮以外的任何按钮提交。

我的解决方法是在您的提交按钮上 trigger click 事件，而不是尝试使用 .submit() 提交表单：

例如http://jsfiddle.net/tkdxg66m/1/

$(".checkbox2").click(
    function(){ 
        $('#submitme').trigger('click');
    }
)

这是非常奇怪的行为，因为 submit() 应该可以工作，所以我正在进一步调查。

下面的旧答案/问题：

您已将代码包装在一个从未调用过的函数中：

您可能打算像这样使用 DOM 就绪处理程序：

       $(function(){
            $(".checkbox1").click(
                function(){ 
                    alert('checkbox 1 clicked'); 
                }
            )
            $(".checkbox2").click(
                function(){ 
                    $('#formId').submit();
                }
            )
        });

注意：$(function(){your code}); 是$(document).ready(function(){your code}); 的快捷方式

或像这样执行的 IIFE（立即调用的函数表达式）：

       (function(){ 
            $(".checkbox1").click(
                function(){ 
                    alert('checkbox 1 clicked'); 
                }
            )
            $(".checkbox2").click(
                function(){ 
                    $('#formId').submit();
                }
            )
        })();

DOM 就绪选项在这种情况下更有意义 :)

【讨论】：

【解决方案2】：

只需使用下面的 jQuery 代码。它适用于提交表单。

$(document).ready(function(e) {
    $(".checkbox2").click(
        function(){ 
           $("#formId").submit();
        }
    );
});

【讨论】：

在 JSFiddle 中使用您的代码尝试他的表单 HTML...它没有提交。确实很奇怪。
到底有什么区别？我最初出于简化原因将 document.ready 代码保留了下来。我已经更新了我原来的帖子。上面的代码就完成了。

【解决方案3】：

将“点击”更改为“更改” - 我同意“点击”应该有效，但它并不总是适合我 =/

【讨论】：

当你今天就在上面！正要说同样的话！第二个答案你也打败了我，大声笑

【解决方案4】：

Waddayaknow，问题解决了！事情是：我将提交按钮命名为“提交”。这导致了问题。我在其他 stackoverflow-threads 中发现了这一点；（submit a form using checkbox）和：（Javascript form submit: Object doesn't support this property or method (IE7)）。无论如何，感谢您的贡献。

【讨论】：