How to perform function after Jquery (window).load is complete:
http://stackoverflow.com/questions/5416209/how-to-perform-function-after-jquery-window-load-is-complete
引用
$(window).load( function() { //do something });
关于$(document).ready 和 $(window).load 的区别:
http://wuaner.iteye.com/admin/blogs/319769
下列代码会报该js错误:
$(document).ready(function() { $.validator.methods.atLeastOneChannel = function(value, element, param) { var n = 0; $("select").each(function (i) { if (this.id == "fidsDispTempdataList.channelid" && this.value != "") { ///alert(this.id + " " + this.value); n+=1; } }); return n >= 1; }; $.validator.addClassRules("intClass", { digits:true }); $("select").change(function () { if($(this).attr("id") == "fidsDispTempdataList.channelid") { ///alert($(this).val()); var curStartNumNode = $(this).parent().next().next().children().get(0); //var curPerPageNumNode = $(this).parent().next().next().next().next().children().get(0); //var curPagesNode = $(this).parent().next().next().next().next().next().next().children().get(0); var curPagesNode = $(this).parent().next().next().next().next().children().get(0); if($(this).val() == "") { $(curStartNumNode).rules("remove"); //$(curPerPageNumNode).rules("remove"); $(curPagesNode).rules("remove"); } else { $(curStartNumNode).rules("add", {required: true}); //$(curPerPageNumNode).rules("add", {required: true}); $(curPagesNode).rules("add", {required: true}); } } }); //在遍历页面select时出的错 $('select').each( function(){ if($(this).attr("id")=="fidsDispTempdataList.channelid" && $(this).val()!="") { ///alert($(this).val()); var curStartNumNode = $(this).parent().next().next().children().get(0); //var curPerPageNumNode = $(this).parent().next().next().next().next().children().get(0); //var curPagesNode = $(this).parent().next().next().next().next().next().next().children().get(0); var curPagesNode = $(this).parent().next().next().next().next().children().get(0); try { $(curStartNumNode).rules("add", {required: true}); $(curPagesNode).rules("add", {required: true}); } catch( error ) { alert(error.message); } } }); $("#templateForm").validate({ rules: { "fidsDispTemplate.code": { required: true }, "fidsDispTemplate.name": { required: true }, "fidsDispTemplate.mainPage": { required: true }, "channelSpan" : { atLeastOneChannel : true } }, messages: { "fidsDispTemplate.code": { required: "<s:text name='template.validation.code.required'/>" }, "fidsDispTemplate.name": { required: "<s:text name='template.validation.name.required'/>" }, "fidsDispTemplate.mainPage": { required: "<s:text name='template.validation.mainPage.required'/>" }, "channelSpan" : { atLeastOneChannel : "<s:text name='template.validation.atLeastOneChannel'/>" } }, errorPlacement: function(error, element) { ///alert(element.attr("className")); if (element.attr("className") == "intClass error") { ///error.insertBefore(element); return true; } else { error.insertAfter(element); } } }); });
经研究发现,是页面dom元素加载顺序导致的该问题。解决办法两个:
一 将遍历select元素并对其做操作的出错代码 $('select').each()放至$("#templateForm").validate()之后(即$(document).ready()的最后面):
$(document).ready(function() { $.validator.methods.atLeastOneChannel = function(value, element, param) { var n = 0; $("select").each(function (i) { if (this.id == "fidsDispTempdataList.channelid" && this.value != "") { ///alert(this.id + " " + this.value); n+=1; } }); return n >= 1; }; $.validator.addClassRules("intClass", { digits:true }); $("select").change(function () { if($(this).attr("id") == "fidsDispTempdataList.channelid") { ///alert($(this).val()); var curStartNumNode = $(this).parent().next().next().children().get(0); //var curPerPageNumNode = $(this).parent().next().next().next().next().children().get(0); //var curPagesNode = $(this).parent().next().next().next().next().next().next().children().get(0); var curPagesNode = $(this).parent().next().next().next().next().children().get(0); if($(this).val() == "") { $(curStartNumNode).rules("remove"); //$(curPerPageNumNode).rules("remove"); $(curPagesNode).rules("remove"); } else { $(curStartNumNode).rules("add", {required: true}); //$(curPerPageNumNode).rules("add", {required: true}); $(curPagesNode).rules("add", {required: true}); } } }); $("#templateForm").validate({ rules: { "fidsDispTemplate.code": { required: true }, "fidsDispTemplate.name": { required: true }, "fidsDispTemplate.mainPage": { required: true }, "channelSpan" : { atLeastOneChannel : true } }, messages: { "fidsDispTemplate.code": { required: "<s:text name='template.validation.code.required'/>" }, "fidsDispTemplate.name": { required: "<s:text name='template.validation.name.required'/>" }, "fidsDispTemplate.mainPage": { required: "<s:text name='template.validation.mainPage.required'/>" }, "channelSpan" : { atLeastOneChannel : "<s:text name='template.validation.atLeastOneChannel'/>" } }, errorPlacement: function(error, element) { ///alert(element.attr("className")); if (element.attr("className") == "intClass error") { ///error.insertBefore(element); return true; } else { error.insertAfter(element); } } }); //将该段遍历页面select的出错代码移至ready()方法的最后,错误不再出现 $('select').each( function(){ if($(this).attr("id")=="fidsDispTempdataList.channelid" && $(this).val()!="") { ///alert($(this).val()); var curStartNumNode = $(this).parent().next().next().children().get(0); //var curPerPageNumNode = $(this).parent().next().next().next().next().children().get(0); //var curPagesNode = $(this).parent().next().next().next().next().next().next().children().get(0); var curPagesNode = $(this).parent().next().next().next().next().children().get(0); try { $(curStartNumNode).rules("add", {required: true}); $(curPagesNode).rules("add", {required: true}); } catch( error ) { alert(error.message); } } }); });
二 将将遍历select元素并对其做操作的出错代码从$(document).ready()中抽出来,放到$(document).ready()下面的$(window).load()中:
$(document).ready(function() { $.validator.methods.atLeastOneChannel = function(value, element, param) { var n = 0; $("select").each(function (i) { if (this.id == "fidsDispTempdataList.channelid" && this.value != "") { ///alert(this.id + " " + this.value); n+=1; } }); return n >= 1; }; $.validator.addClassRules("intClass", { digits:true }); $("select").change(function () { if($(this).attr("id") == "fidsDispTempdataList.channelid") { ///alert($(this).val()); var curStartNumNode = $(this).parent().next().next().children().get(0); //var curPerPageNumNode = $(this).parent().next().next().next().next().children().get(0); //var curPagesNode = $(this).parent().next().next().next().next().next().next().children().get(0); var curPagesNode = $(this).parent().next().next().next().next().children().get(0); if($(this).val() == "") { $(curStartNumNode).rules("remove"); //$(curPerPageNumNode).rules("remove"); $(curPagesNode).rules("remove"); } else { $(curStartNumNode).rules("add", {required: true}); //$(curPerPageNumNode).rules("add", {required: true}); $(curPagesNode).rules("add", {required: true}); } } }); $("#templateForm").validate({ rules: { "fidsDispTemplate.code": { required: true }, "fidsDispTemplate.name": { required: true }, "fidsDispTemplate.mainPage": { required: true }, "channelSpan" : { atLeastOneChannel : true } }, messages: { "fidsDispTemplate.code": { required: "<s:text name='template.validation.code.required'/>" }, "fidsDispTemplate.name": { required: "<s:text name='template.validation.name.required'/>" }, "fidsDispTemplate.mainPage": { required: "<s:text name='template.validation.mainPage.required'/>" }, "channelSpan" : { atLeastOneChannel : "<s:text name='template.validation.atLeastOneChannel'/>" } }, errorPlacement: function(error, element) { ///alert(element.attr("className")); if (element.attr("className") == "intClass error") { ///error.insertBefore(element); return true; } else { error.insertAfter(element); } } }); }); //the end of $(document).ready() $(window).load( function() { $('select').each( function(){ if($(this).attr("id")=="fidsDispTempdataList.channelid" && $(this).val()!="") { ///alert($(this).val()); var curStartNumNode = $(this).parent().next().next().children().get(0); //var curPerPageNumNode = $(this).parent().next().next().next().next().children().get(0); //var curPagesNode = $(this).parent().next().next().next().next().next().next().children().get(0); var curPagesNode = $(this).parent().next().next().next().next().children().get(0); try { $(curStartNumNode).rules("add", {required: true}); $(curPagesNode).rules("add", {required: true}); } catch( error ) { alert(error.message); } } }); });