处理jQuery(document).ready中的错误

时间:2021-10-01 00:04:15

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:

我正在开发用于Web框架的JS,并经常与其他开发人员(通常容易出错)的jQuery代码混合使用。不幸的是,他们的jQuery(文档).ready块中的错误阻止了我的执行。采取以下简单示例:

<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 that will run even in the case of previous errors?

不管先前发生了什么,第二个就绪块不应该执行吗?是否有一种“安全”的方式来运行jQuery(document).ready即使出现以前的错误也会运行?

EDIT: I have no control/visibility over the error-prone blocks as they're written by other authors and mixed in arbitrarily.

编辑:我没有对容易出错的块的控制/可见性,因为它们是由其他作者编写的并且是任意混合的。

5 个解决方案

#1


13  

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.)

我没有尝试过这段代码,但它应该可行(至少,这个想法应该是这样)。确保在jquery之后包含它,但是在任何可能有bug的脚本之前。 (没必要,请参阅评论。)

var oldReady = jQuery.ready;
jQuery.ready = function(){
  try{
    return oldReady.apply(this, arguments);
  }catch(e){
    // handle e ....
  }
};

#2


2  

To answer your question, both of the ready blocks are essentially combined into one given the way jQuery works:

为了回答你的问题,两个就绪块基本上按照jQuery的工作方式组合成一个:

<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.

所以这就是为什么它没有警告上面的错误。我不相信有一种方法可以解决这个问题,使每个准备好的功能运行,无论以前的故障。

#3


1  

Have you attempted wrapping the error-prone commands in try...catch brackets?

您是否尝试在try ... catch括号中包含容易出错的命令?

$(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(){ ... });

为避免混淆,$(function(){...});在功能上与$(document).ready(function(){...})相同;

#4


1  

Here is solution, it will wrap any function sent to ready with try-catch block:

这是解决方案,它将使用try-catch块包装任何发送到ready的函数:

(function($){
    $.fn.oldReady = $.fn.ready;
    $.fn.ready = function(fn){
        return $.fn.oldReady( function(){ try{ if(fn) fn.apply($,arguments); } catch(e){}} );
    }
})(jQuery);

#5


-2  

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.

您可以在每个代码块之前重新引用jQuery。然后,您的代码将使用库的新实例,并且它将执行。我已经在OSX上的Safari 4.0.3中对此进行了测试。

<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>

#1


13  

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.)

我没有尝试过这段代码,但它应该可行(至少,这个想法应该是这样)。确保在jquery之后包含它,但是在任何可能有bug的脚本之前。 (没必要,请参阅评论。)

var oldReady = jQuery.ready;
jQuery.ready = function(){
  try{
    return oldReady.apply(this, arguments);
  }catch(e){
    // handle e ....
  }
};

#2


2  

To answer your question, both of the ready blocks are essentially combined into one given the way jQuery works:

为了回答你的问题,两个就绪块基本上按照jQuery的工作方式组合成一个:

<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.

所以这就是为什么它没有警告上面的错误。我不相信有一种方法可以解决这个问题,使每个准备好的功能运行,无论以前的故障。

#3


1  

Have you attempted wrapping the error-prone commands in try...catch brackets?

您是否尝试在try ... catch括号中包含容易出错的命令?

$(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(){ ... });

为避免混淆,$(function(){...});在功能上与$(document).ready(function(){...})相同;

#4


1  

Here is solution, it will wrap any function sent to ready with try-catch block:

这是解决方案,它将使用try-catch块包装任何发送到ready的函数:

(function($){
    $.fn.oldReady = $.fn.ready;
    $.fn.ready = function(fn){
        return $.fn.oldReady( function(){ try{ if(fn) fn.apply($,arguments); } catch(e){}} );
    }
})(jQuery);

#5


-2  

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.

您可以在每个代码块之前重新引用jQuery。然后,您的代码将使用库的新实例,并且它将执行。我已经在OSX上的Safari 4.0.3中对此进行了测试。

<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>