如何解决与Highchart的原型冲突？ [英] How to fix Prototype conflict with Highchart?

问题描述

我有一个AJAX动作，并试图同时使用Highchart，这就是为什么我需要包含Prototype。

这是我的代码，但没有显示Highchart图表：

 < script src =https://ajax.googleapis.com/ajax/libs/prototype/1.7 /prototype.js\"></script> 
< script src =https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js>< / script> 
< script src =http://code.highcharts.com/highcharts.js>< / script> 
 
< div id =containsstyle =min-width：310px; height：400px; margin：0 auto>< / div> 
  

以下是信息：

 （function（$）{
 
 $ .noConflict（）; 
 $（function（）{
 $ '#contain'）。highcharts（{
 .... 
}）; 
}）; 
 
}（jQuery））; 
  

I have an AJAX action and trying to use Highchart at the same time that's why I need Prototype to be included.

Here is my code but is not showing the Highchart graph:

<script src="https://ajax.googleapis.com/ajax/libs/prototype/1.7/prototype.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>

<div id="contain" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

Here is the information: http://jsfiddle.net/dhdSL/4/

Of course is working 100% without Prototype: http://jsfiddle.net/dhdSL/5/

I tried jQuery.noConflict(); and is not showing the Highchart graph http://jsfiddle.net/dhdSL/6/

And tried $.noConflict(); and is not showing the Highchart graph http://jsfiddle.net/dhdSL/7/

I was searching in Stack Overflow for an answer, blogs, Facebook, books, Google and spent six months and still don't find the answer.

I tried changing Prototype in all version but still not working and is not showing errors in console.

According with a friend told me to include noConflict at the end but is not showing in google chrome browser and is showing an error: http://jsfiddle.net/dhdSL/8/

When open the error I'm getting another error:

解决方案

Wrap your jQuery into an anonymous function to protect the variable from being interfered with by Prototype. http://jsfiddle.net/amyamy86/s6ms3/

(function($) {

    $.noConflict();
    $(function () {
        $('#contain').highcharts({
         ....
        });
     });

}(jQuery));

这篇关于如何解决与Highchart的原型冲突？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！