javascript - 如何修复 Prototype 与 Highchart 的冲突？

Question

我有一个 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="contain" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

这是信息:http://jsfiddle.net/dhdSL/4/

当然是在没有原型(prototype)的情况下 100% 工作:http://jsfiddle.net/dhdSL/5/

我试过 jQuery.noConflict(); 但没有显示 Highchart 图 http://jsfiddle.net/dhdSL/6/

并尝试了 $.noConflict(); 但未显示 Highchart 图 http://jsfiddle.net/dhdSL/7/

我在 Stack Overflow、博客、Facebook、书籍、Google 中搜索答案，花了六个月，但仍然没有找到答案。

我尝试在所有版本中更改 Prototype，但仍然无法正常工作，并且未在控制台中显示错误。

据一位 friend 告诉我，在末尾包含 noConflict，但在 google chrome 浏览器中没有显示，并且显示错误:http://jsfiddle.net/dhdSL/8/

打开错误时出现另一个错误:

Answer 1

将你的 jQuery 包装成一个匿名函数，以保护变量不受 Prototype 的干扰。 http://jsfiddle.net/amyamy86/s6ms3/

(function($) {

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

}(jQuery));