Handling errors in jQuery(document).ready
I'm developing JS that is used in a web framework, and is frequently mixed in with other developers' (often error-prone) jQuery code. Unfortunately errors in their jQuery(document).ready blocks prevent mine from executing. Take the following simple sample:
<script type="text/javascript">
jQuery(document).ready(function() {
nosuchobject.fakemethod(); //intentionally cause major error
});
</script>
<script type="text/javascript">
jQuery(document).ready(function() {
alert("Hello!"); //never executed
});
</script>
Shouldn't the second ready block execute regardless of what happened in the previous? Is there a "safe" way to run jQuery(document).ready tha开发者_Go百科t will run even in the case of previous errors?
EDIT: I have no control/visibility over the error-prone blocks as they're written by other authors and mixed in arbitrarily.
I haven't tried this code, but it should work (at least, the idea should anyway). Make sure you include it AFTER jquery, but BEFORE any potentially buggy scripts. (Not necessary, see comments.)
var oldReady = jQuery.ready;
jQuery.ready = function(){
try{
return oldReady.apply(this, arguments);
}catch(e){
// handle e ....
}
};
To answer your question, both of the ready blocks are essentially combined into one given the way jQuery works:
<script type="text/javascript">
jQuery(document).ready(function() {
nosuchobject.fakemethod(); //intentionally cause major error
alert("Hello!"); //never executed
});
</script>
So that's why its not alerting per the error above. I don't believe there is a way to fix this to make every ready function run regardless of former failures.
Have you attempted wrapping the error-prone commands in try...catch brackets?
$(function(){
try {
noObject.noMethod();
} catch (error) {
// handle error
}
});
$(function(){
try {
alert("Hello World");
} catch (error) {
// handle error
}
});
To avoid potential confusion, $(function(){ ... }); is functionally the same as $(document).ready(function(){ ... });
Here is solution, it will wrap any function sent to ready with try-catch block:
(function($){
$.fn.oldReady = $.fn.ready;
$.fn.ready = function(fn){
return $.fn.oldReady( function(){ try{ if(fn) fn.apply($,arguments); } catch(e){}} );
}
})(jQuery);
You could re-reference jQuery before each of your code blocks. Your code would then use the fresh instance of the library, and it would execute. I've tested this in Safari 4.0.3 on OSX.
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function() {
nosuchobject.fakemethod(); //intentionally cause major error
});
</script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function() {
alert("Hello!"); //executed!
});
</script>
</head>
<body>
<p>hello world</p>
</body>
</html>
加载中,请稍侯......
精彩评论