Question

我打算使用多个jquery脚本来做不同的事情。该网站已无法正常运行。我可以使用动态加载程序或内容滑块，如代码所示。我知道它与jquery-1.6.2.min.js和另一个.min.js文件有关。我怎样才能让这两个脚本都有效？

<!DOCTYPE html>
<html>

<head>
<meta http-equiv='Content-Type' content='text/html; charset=UTF-8' />

<title>Dynamic Page | Home</title>

<link rel='stylesheet' type='text/css' href='../css/style.css' />


<!--DYNAMIC LOADER-->
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js'></script>
<script type='text/javascript' src='../js/jquery.ba-hashchange.min.js'></script>
<script type='text/javascript' src='../js/dynamicpage.js'></script>

<!--CONTENT SLIDER-->
<link rel="stylesheet" href="../css/basic-jquery-slider.css">
<script src="../js/jquery-1.6.2.min.js"></script>
<script src="../js/basic-jquery-slider.js"></script>


<!--CONTENT SLIDER-->
<script>
  $(document).ready(function() {

    $('#banner').bjqs({
      'animation' : 'slide',
      'width' : 940,
      'height' : 403
    });

  });
</script>

<style>
.container {
width: 100%; left: 0; right: 0; top:0; bottom: 0; position: fixed; overflow: auto;
background-image:url(../images/screen.png);
font-family: Helvetica, sans-serif;
}
</style>
</head>

<body>
<div class="container">

<div id="page-wrap">


      <nav>

          <ul class="group">
          <img src="../../Website/images/logo.png">
              <li><div id="home"><a href="index.html"><img src="../images/menu-home.png"></div></a></li>
              <li><div id="about"><a href="about.html"><img src="../images/menu-about.png"></div></a></li>
              <li><div id="gallery"><a href="contact.html"><img src="../images/menu-gallery.png"></div></a></li>
              <li><div id="affiliates"><a href="#l"><img src="../images/menu-affiliates.png"></div></a></li>
              <li><div id="biography"><a href="#"><img src="../images/menu-bio.png"></div></a></li>
              <li><div id="contact"><a href="#"><img src="../images/menu-contact.png"></div></a></li>
          </ul>
      </nav>


    <section id="main-content">
    <div id="guts">



     <div id="container">

  <div id="banner">
    <ul class="bjqs">
      <li><img src="../images/banner02.jpg" title="Cool Skull"></li>
      <li><img src="../images/banner04.jpg" title="Women1"></li>
      <li><img src="../images/banner01.jpg" title="Kid With Shell"></li>
      <li><img src="../images/banner03.jpg" title="Women2"></li>
    </ul>
  </div>
</div>

    </div>
    </section>

</div>

</div>
</body>

</html>

Answer 1

我认为这里没有好的解决方案，而是两个选择：

解决遗留代码中的任何不兼容问题，以便在最新版本的jQuery上运行
修改当前代码，使其与先前版本的jQuery兼容，如果选项1不可行。

我建议这样做是因为为了支持两个版本的jQuery，你仍然需要更新一个脚本或另一个脚本来引用jQuery通过$ jq（或其他东西）而不是标准的$。如果您要以这种方式更新一个代码库或另一个代码库，那么使用这段时间来简单地解决不兼容问题并支持单个版本的jquery会更有效。原因很多，但最重要的是：

对同一框架的两次引用可能会使其他开发人员对项目感到困惑。
由于页面现在必须两次请求框架，因此性能受到阻碍。
由于您仍需要更新代码库以不同方式引用单独版本的jQuery，因此节省的时间不多。
插件和事件处理程序仍然存在冲突或问题。

花时间解决问题以支持一个框架而花费时间来支持同一框架的两个实例将提高项目的稳定性并使其更容易支持。

Answer 2

哦！我看到你在同一页面上使用了多个版本的jquery。冲突必定会发生。在这里，试试这个链接。

http://web.enavu.com/daily-tip/using-multiple-versions-of-jquery-on-the-same-page/

它可能会解决您的问题。

多个Jquery脚本

2 个答案: