Jquery與另一個衝突

我有一個JQuery下拉列表，直到我嘗試在同一頁面上添加一個Jquery日期選擇器。 datepicker的作品，但下拉列表被刪除。我不確定導致衝突的原因，我試圖讓他們兩個都工作。Jquery與另一個衝突

---- ----頭

<head> 
    <link rel="stylesheet" type="text/css" href="fancystyle1/styles.css" > 
    <link rel="stylesheet" type="text/css" href="css/style.css" > 

    <script src="fancystyle1/js/vendor/jquery-1.9.0.min.js"></script> 
    <script src="fancystyle1/js/vendor/modernizr.js"></script> 

    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/> 
     <!--<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>--> 
     <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script> 

     <script> 
      $(document).ready(function() { 
      $("#datepicker").datepicker(); 
      }); 
     </script> 

<script src="fancystyle1/js/jquery.simple.select.js"></script> 
      <script type="text/javascript"> 
       $(function() { 
        $('select').selectBoxes(); 
       });    
      </script> 

</head>

來源

2014-10-03 Dan_ENZ

如果可以，請避免在您的網站上使用2個jQuery版本。對於較老的瀏覽器兼容性，jQuery版本1.11.1是最好的選擇。否則，請堅持使用最高版本（1.9.0）並轉儲其他（1.6.2） – 2014-10-03 09:43:49

您還應該顯示您的組合頁面，而不是兩個單獨的頁面。那麼關於改變什麼的建議將具體:) – 2014-10-03 09:48:39

答案更新如下。包含樣式，然後是腳本（只有1個jQuery和其他腳本之前），然後是主體末尾的頁面特定代碼。 – 2014-10-03 10:06:14

您包括jQuery庫兩次，在這裏：

<script src="fancystyle1/js/vendor/jquery-1.9.0.min.js"></script>

這裏：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>

這是原因衝突。從代碼中刪除第二個字符串。

來源

2014-10-03 09:45:54 mochalygin

顯示的那些代碼示例是兩個單獨的頁面。綜合結果不顯示，所以你需要看到最終版本之前，說「刪除第二個字符串」:) – 2014-10-03 09:47:09

刪除第二個停止日期選擇器工作不幸，雖然... – 2014-10-03 09:49:37

對不起，真正的藍色，應該做出它更清楚...代碼是在一個頁面上..只是試圖分開來觀看 – 2014-10-03 09:50:44

如果可以，請避免在您的網站上使用2個jQuery版本。對於較老的瀏覽器兼容性，jQuery版本1.11.1是最好的選擇。否則，只是你的最高版本（1.9.0）堅持和轉儲等（1.6.2）

元素是從你的榜樣缺失（如選擇），但你會想現在是這樣的：

<head> 
    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/> 
    <link rel="stylesheet" type="text/css" href="fancystyle1/styles.css" > 
    <link rel="stylesheet" type="text/css" href="css/style.css" >  
    <script src="fancystyle1/js/vendor/jquery-1.9.0.min.js"></script> 
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script> 
    <script src="fancystyle1/js/vendor/modernizr.js"></script> 
    <script src="fancystyle1/js/jquery.simple.select.js"></script> 
</head> 

<body> 
    <input id="datepicker" style="width: 100px;"/> 
    <script type="text/javascript"> 
    $(function() { 
     $('select').selectBoxes(); 
     $("#datepicker").datepicker(); 
    });    
    </script> 
</body>

注：

包括在頭部組件腳本（至少現在是這樣，你可以很容易地找到它們）。效率/緩存/捆綁更改稍後提供。
在jQuery UI之前和使用jQuery的任何其他腳本之前包含jQuery。
只有包含jQuery 的1個版本（如果可以的話）。支持多個同步版本是一場噩夢。
查詢1.11.1是舊版瀏覽器支持的最新/最新版本。
頁面特定的jQuery包裝在DOM就緒事件處理程序中，因此可以轉到頁面中的任何位置。在body結束時是一個普遍的立場，但在head也很好。

來源

2014-10-03 09:54:52

Jquery與另一個衝突

回答

相關問題