jquery之间的冲突？答案

【问题标题】：Conflict between jqueries?jquery之间的冲突？
【发布时间】：2014-08-23 12:04:27
【问题描述】：

嗨，我想在 Asp.net MVC4 中使用 EasyUI GridView 和 Tab，我将两个 Grid 放在一个 Tab 中。但我有问题。我在我的布局中添加了这些脚本和 css：

    <link href="@Url.Content("~/Content/kendo/2013.1.319/kendo.common.min.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/kendo/2013.1.319/kendo.blueopal.min.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/kendo/2013.1.319/kendo.rtl.min.css")" rel="stylesheet" type="text/css" />
<link href="~/Content/1-ui.core.css" rel="stylesheet" />
<link href="~/Content/2-ui.theme.css" rel="stylesheet" />
<link href="~/Content/3-ui.datepicker.css" rel="stylesheet" />

<script src="~/Scripts/jquery-1.7.1.js"></script>

<script src="@Url.Content("~/Scripts/kendo/2013.1.319/jquery.min.js")"> </script>
<script src="@Url.Content("~/Scripts/kendo/2013.1.319/kendo.all.min.js")"> </script>
<script src="@Url.Content("~/Scripts/kendo/2013.1.319/kendo.aspnetmvc.min.js")"> </script>
<script src="@Url.Content("~/Scripts/kendo.modernizr.custom.js")"> </script>

<script src="~/Scripts/jquery-ui-1.9.2.min.js"> </script>

<script src="~/Scripts/jquery.ui.datepicker-cc.js"> </script>
<script src="~/Scripts/calendar.js"> </script>
<script src="~/Scripts/jquery.ui.datepicker-cc-fa.js"> </script>
<script src="~/Scripts/jquery.unobtrusive-ajax.js"> </script>

我在我的索引中添加了这些：

<script src="~/Scripts/MapScript/Sld.js"></script>
<script src="~/Scripts/MapScript/proj4js-compressed.js"></script>
<script src='http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAl9RMqSzhPUXAfeBCXOussRSPP9rEdPLw3W8siaiuHC3ED5y09RTJKbutSNVCYFKU-GnzKsHwbJ3SUw'></script>
<script src="~/Scripts/MapScript/ToolsMenu.js"></script>
<link href="~/Content/MapStyle/MStyle.css" rel="stylesheet" /> 
<script src="~/OpenLayers.js"></script>
<script src="~/Scripts/MapScript/LoadMap.js"></script>
<script src="~/Scripts/mootools-core-1.4-full.js"></script>
<script src="~/Scripts/mootools-more-1.4-full.js"></script>

在我想要加载 EasyUI GridView 的页面中，我添加了这些：

 <link href="~/Scripts/easyui-1.3.6/themes/icon.css" rel="stylesheet" />
<link href="~/Scripts/easyui-1.3.6/themes/default/easyui.css" rel="stylesheet" />
<link href="~/Scripts/easyui-1.3.6/themes/default/easyui-rtl.css" rel="stylesheet" />

但是当我加载我的页面时，首先 Tab 没有加载并且 reClick on its Link ，它加载了。

我认为这是因为添加了?????!!!的jquery之间发生冲突

注意：当我创建这个没有索引和布局的页面时，没有问题

有什么问题？？

【问题讨论】：

好吧，您的页面上至少包含 3 个不同的 jquery 以及许多其他废话。为什么？如果你得到任何控制台错误是什么？
控制台不显示错误。我的项目很大，我的页面之一是这个。我已经用 Kendo 编写了我的项目，现在我想用 EasyUI GridView 替换网格 kendo。

标签： javascript jquery asp.net-mvc jquery-easyui

【解决方案1】：

尽量使用$.noConflict()，避免不同js文件冲突。

请看这里：- http://api.jquery.com/jquery.noconflict/

注意：- 尝试在一处包含所需的 js 和 css 文件。

【讨论】：

【解决方案2】：

在 jQuery 之前加载 Mootools。然后，使用任一

document.id("id_of_element")

或将任何 Mootools 类包含在

中

( function () {
    $ = document.id;
    this.MyClass = new Class({
    ...
    });
 })();

这至少可以解决 jQuery 和 MooTools 之间的任何冲突。

【讨论】：