如何添加這個jQuery庫到我的項目？

我在學校裏與JS合作過很多，但我們從未使用過庫。關於如何成功地將具有所有必要外部資源的項目添加到項目中，網上的信息非常少。如何添加這個jQuery庫到我的項目？

我想添加一個庫，使用jQuery有一個小窗口彈出內頁面（http://jsfiddle.net/55DBx/1/）我正在工作的網站，但不管我做什麼，它不工作作爲它應該。上的jsfiddle，它說，圖書館需要jQuery的ui.js和jQuery-ui.css我已經都鏈接到我的HTML文件，如下所示：

<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script> 
 
<link rel="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">

，我已經加入從jsFiddle到我的項目的示例代碼，它不起作用。彈出窗口的內容直接顯示在頁面上。

<button id="btnExample">open the dialog</button> 
 
<div id="dialog" title="Test"> 
 
    <img src="image.png" /> 
 
</div> 
 

 
<script>$("#dialog").dialog({ autoOpen: false }); 
 
$("#btnExample").click(function() { 
 
    $("#dialog").dialog("open"); 
 
});</script>

我缺少什麼？ :(

來源

2017-04-06 Nihilish

您可以將庫引用在錯誤的地方，你應該<head></head>部分。內，並在你的CSS參考安置他們，你添加的鏈接rel屬性，該屬性用於指定的關係當前文檔和所鏈接的文檔/資源，你應該添加鏈接href屬性

$("#dialog").dialog({ autoOpen: false }); 
 
$("#btnExample").click(function() { 
 
    $("#dialog").dialog("open"); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script> 
 
<link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css"> 
 

 
<button id="btnExample">open the dialog</button> 
 
<div id="dialog" title="Randy"> 
 
    <img src="http://icons.iconarchive.com/icons/sykonist/south-park/256/Randy-Marsh-Jamming-2-icon.png" /> 
 
</div>

整個代碼：

<html> 

<head> 
    <link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
    <script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script> 
    <script type="text/javascript"> 
    $(function() { 
     $("#dialog").dialog({ 
      autoOpen: false 
     }); 
     $("#btnExample").click(function() { 
      $("#dialog").dialog("open"); 
     }); 
    }); 
    </script> 
</head> 

<body> 
    <button id="btnExample">open the dialog</button> 
    <div id="dialog" title="Randy"> 
     <img src="http://icons.iconarchive.com/icons/sykonist/south-park/256/Randy-Marsh-Jamming-2-icon.png" /> 
    </div> 
</body> 

</html>

來源

2017-04-06 02:42:04 pblyt

謝謝！這工作！我的''：'''因爲它沒有這條線沒有在jsFiddle上列出。這只是一個標準線添加任何使用AJAX的東西？ – Nihilish

不客氣。如果這對您有用，請隨時將其標記爲答案。是的，如果您使用的是AJAX，它是jQuery API之一，您必須添加此庫引用。 – pblyt

如何添加這個jQuery庫到我的項目？

回答

相關問題