Question

我在我的主页面上使用下面的代码，其中其他页面使用ajax在TWO RADIO BUTTONS的帮助下加载

<script>
function loadXMLDoc(str)
{
var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
    }
  }
  if(str=="Candidate")
  {
     xmlhttp.open("GET","creg.php",true);       
  }
  else if(str=="Employer")
  {     
     xmlhttp.open("GET","Empyr.php",true);
  }

xmlhttp.send();
}
</script>

下面的脚本是为FORM VALIDATION编写的（写在主页末尾），这个脚本只在第一次加载主页时才有效，但是第二次使用ajax加载表单时这个脚本不能正常工作

<script>
$.validate({
  form : '#cand, #employerRegister'
})
; 
</script>

我知道脚本在页面加载时会被读取，但是现在我应该在哪里编写这个脚本，以便在我使用ajax加载表单时它可以工作，我错了？

Answer 1

您使用的是验证引擎吗？我不会优先使用纯javascript进行ajax调用，看起来很乱。

jQuery(document).ready(function($) {
$('#registration').validate({

        rules:{

            email: {
                    email: true
                },
            password : {
                minlength : 6
            },
            repassword : {
                minlength : 6,
                equalTo : "#password"
            }

        },


        submitHandler: function(form) {
    // do other things for a valid form

        var post = {};

        form_data = $(form).serialize();
        //console.log(form_data);
        //console.log(book_form);

        if(post)
        {
              $.post(site_url+'/members/register',form_data,
                   function(response){  
                        var res1 = $.parseJSON(response);
                        console.log(res1);
                        if(res1.success == true )
                        {
                                $('.success_message').html('You are successfully registered ').show();
                                window.location.href = site_url+'/pages/registerstep';

                                clear_form(form);
                        }
                        else
                        {
                            $('.error_message').html(res1.success).show();
                            //clear_form(form);
                        }

                   }

            ); 
        }
    }
  });

}）;

使用类似的东西。这会奏效。第一次加载后代码无效的原因是因为在表单提交时没有触发验证

Answer 2

在将新元素插入DOM之后，您需要再次运行代码来绑定事件处理程序。最好使用跨平台的javascript框架，如jQuery，Prototypejs等

你需要再次从ajax响应中调用下面的javascript

<script>
$.validate({
  form : '#cand, #employerRegister'
})
; 
</script>

检查here

使用AJax时不会调用验证脚本

2 个答案: