Question

我想通过两个级别查看表单。第1级：如果未填写任何必填字段，则为preventDefault。第二级：如果第一个是好的并且将要提交，那么我想用表单数据执行ajax。这是我的表格：

<form  id="form_sample_1" class="form-horizontal normalForm">
                <div id="info-container2">

                </div>
                <div class="form-group c_name_container">
                    <div class="col-md-12">
                        <div class="input-group">
                            <span class="input-group-addon">
                                <i class="fa fa-envelope"></i>
                            </span>
                            <input type="text" id="c_name"  class="form-control required" placeholder="Type your Name here"/>
                        </div>
                    </div>
                </div>

                <div class="form-group c_email_container">
                    <div class="col-md-12">
                        <div class="input-group">
                            <span class="input-group-addon">
                                <i class="fa fa-envelope"></i>
                            </span>
                            <input  id="c_email" class="form-control required" type="email" placeholder="Type your Email Address">
                        </div>
                    </div>
                </div>
                <div class="form-actions">
                    <div class="row">
                        <div class="col-md-offset-3 col-md-9">
                            <button type="button" id="start_chat" class="btn green">Start Chat</button>
                        </div>
                    </div>
                </div>
            </form>

我的第一级Jquery：

$(document).on("click", ".normalForm button", function (event) {
   event.preventDefault();
       if(noError){
                    $(this).closest('form').unbind('submit').submit();
                }

});

这里noError的布尔值为true或false。如果存在错误，则其值为false，否则其值为true。由于简单性，我不显示所有代码。我的代码运行正常。但在此验证成功后，我想再次阻止正常提交。我想通过＆＃39; start_chat＆＃39;来做到这一点。 id如下：

   $('#start_chat').click(function(){
// if first level validation is okay then Do Ajax with form values. 
});

在这种情况下$('#start_chat').click(function(){和$(document).on("click", ".normalForm button", function (event)引用相同的按钮并出现歧义问题。一种可能的解决方案是将第二级js的代码拧入第一级js。但在我的情况下，我想将第一级js用于通用目的，而第二级则更具体用途。任何想法

Answer 1

不是选择$（'。normalForm按钮）并将第一级逻辑绑定到其click事件，而是将特定类添加到要执行第一级的按钮。所以只需将这些特定按钮命名为$（'。firstlevelbutton'）或其他东西。然后你可以将事件绑定到$（'＃start_chat'）并在那里做你想做的事。

如何在两个js文件中的相同按钮上点击功能

1 个答案: