Question

所以我试图在jquery中提交一个表单来隐藏或显示内容。

但是再次提交后它无效。

HTML：

<form id="filters" href="#">
        <table id="filter" class="table">
                <thead>
                    <tr>
                    <th>Show/Hide</th><th>Column</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                    <td>
                    <input type="checkbox" name="checkNumber" value="1"/>
                    </td>
                    <td>
                    Account Number
                    </td>
                    </tr>
                </tbody>
        </table>
</form>

Jquery的：

$(function() {
   $('#filters').submit(function() {
       if ($('input[name=checkNumber]').attr('checked') == true) {
           $('input[name=search_account]').show("normal");      
       }
      else if ($('input[name=checkNumber]').attr('checked') !== true) {
           $('input[name=search_account]').hide("normal");
       }
           return false;
    }); 

});

我已经尝试了很多其他方法，但这一切都是一样的。我提交，它隐藏了正确的输入标签，但是当我重新提交以显示它时，它不起作用。

如果我选中复选框提交它也不起作用。

任何帮助将不胜感激！

Answer 1

使用.on('submit',function(){ your code here and check your code in the else if part. you should use != not !==});

Answer 2

试试这个。

 else if ($('input[name=checkNumber]').attr('checked') != true) {
           $('input[name=search_account]').hide("normal");
       }

Answer 3

我会说你应该使用

$('input[name=checkNumber]').is(':checked')

而不是

$('input[name=checkNumber]').attr('checked')

Answer 4

刚才意识到你的HTML也是无效的。没有href属性，你应该使用action。但似乎在你的情况下你根本不需要表格。

我认为您可能希望实现的目标是：

<html>
    <head>
        <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
    </head>
    <body>
        <table id="filter" class="table">
            <thead>
                <tr>
                    <th>Show/Hide</th><th>Column</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>
                        <input type="checkbox" name="checkNumber" value="1" />
                    </td>
                    <td>
                        Account Number
                    </td>
                </tr>
            </tbody>
        </table>

        <input name="search_account" style="display: none;" />

        <script type="text/javascript">
            $(function() {
                $("#filter input[name=checkNumber]").click(function() {
                    if ($(this).is(":checked")) {
                        $("input[name=search_account]").show();
                    } else {
                        $("input[name=search_account]").hide();
                    }
                }); 
            });
        </script>

    </body>
</html>

Jquery：提交表单不正常

4 个答案: