Question

这是我的主页面，当页面加载时，“page1”会自动显示，只要单选按钮被切换，“div”内容就会通过ajax更新

 <html>
   <input type="radio" name="radioOption" id="page1" checked="checked"/>
   <input type="radio" name="radioOption" id="page2"/>
   <div id="page1"><jsp:include page="page1"/></div>
   <div id="page2"></div>
</html>

Ajax调用

$(document).ready(function() {
   $('input:radio[name="radioOption"]').on("click", function(e) {
        $.ajax(url:"url", success:function(result){
           $("#page1").empty();
           $("#page2").html(result); 
        };)
    });
});

对于page1和page2没有什么特别之处，它们只是带有一些输入和提交按钮的表单

<form name="someForm">
   <input type=text name="userName"/>
    <button type="submit" id="save-button"/> 
</form>

有一些名为onClick的提交按钮，如下所示

$(document).ready(function() {
    $('#someForm').bind('submit', function(e) {
       someValidationFunctions(); 
 });

我的问题是，当页面首次正常加载时会调用这些验证，在ajax div调用后不会触发这些验证，我缺少什么，任何输入值得赞赏

Answer 1

将on用于动态生成的元素..

 $(document).on('submit','#someForm', function(e) {
   someValidationFunctions(); 
}

如果你使用静态父元素而不是文档本身（性能），那就更好了。

在您的情况下是#page2

 $('#page2').on('submit','#someForm', function(e) {
   someValidationFunctions(); 
}

在Ajax调用之后没有调用$（document）.ready

1 个答案: