Question

我正在尝试使用$（＆＃39;＃form＆＃39;）验证设置验证。大多数示例都使用document.ready。由于我的页面是动态加载的，我不能使用document.ready。

$（＃div）.on（＆＃39; event＆＃39;）的大部分示例都使用click事件，是否可以绑定＆＃39; load＆＃39;事件

<div id="DivWhichIsntLoadedDynamically">
<div id="DynamicallyLoadedDiv">

<form id="myform">  
     <input type="text" name="entry[email]" />  <br/>  
     <input type="text" name="field2" /> <br/> 
     <input type="submit" />
</form>

</div>
</div>

$('#DivWhichIsntLoadedDynamically').on('load', function () {
    alert('div load');

    $('#myform').validate({
        rules: {
            'entry[email]': {
                email: true
            },
            field2: {
                equalTo: '[name="entry[email]"]'
            }
        },
        submitHandler: function(form) { // for demo
            alert('valid form');
            return false;
        }
    });

});

http://jsfiddle.net/JCY2E/6/

更新小提琴： http://jsfiddle.net/JCY2E/8/

Answer 1

jQuery允许您在父容器上附加事件。见jQuery API on。像这样，您可以在当前未加载的内容上附加事件。

$("#containerWhichIsntLoadDynamically").on("myEvent", "#myform", myFunction);

Answer 2

引用OP：

“我正在尝试使用$('#form').validate设置验证...因为我的页面是动态加载的，所以我无法使用document.ready。”

您无法将.validate()方法附加到任何尚不存在的方法。没有解决方法，因为不需要一个，并且不需要绑定任何事件。

您可以在动态加载.validate()后立即调用form方法。由于您从未准确显示如何加载此动态内容，因此我的答案使用通用按钮作为示例。

$(document).ready(function () { $('#test').on('click', function () { // generic button -> trigger demo // load the form dynamically $('#notificationContainer').html('your form markup'); // now you can initialize the plugin $('#myform').validate({ ... }); }); });

DEMO：http://jsfiddle.net/DNZ9Y/

是否可以使用jquery＆＃34; on＆＃34;将加载事件附加到DIV。在动态加载的内容中

2 个答案: