JQuery代碼不運行

Question

我對jquery很新，請幫我在 this link上運行應用程序。我在我的應用程序中添加了以下資源文件，但仍然沒有渲染顏色塊。

這是我已經包括在我的腦海標籤：

<meta charset="utf-8"/> 
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/> 
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0rc2/jquery.mobile-1.0rc2.min.css"/> 
<script src="http://code.jquery.com/jquery-1.6.4.min.js" type="text/javascript"/> 
<script src="http://code.jquery.com/mobile/1.0rc2/jquery.mobile-1.0rc2.min.js" type="text/javascript"/> 
<script src="jquery.mobile.carousel.js" type="text/javascript" language="javascript"/> 
<script src="jquery.ui.ipad.js" type="text/javascript" language="javascript"/> 
<script type="text/javascript" language="javascript" > 
    $(document).ready(function($) { 
     $("#carousel1").carousel(); 
    })(jQuery); 
</script> 

Answer 1

您有：

<meta charset="utf-8"/> 
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/> 
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0rc2/jquery.mobile-1.0rc2.min.css"/> 
<script src="http://code.jquery.com/jquery-1.6.4.min.js" type="text/javascript"/> 
<script src="http://code.jquery.com/mobile/1.0rc2/jquery.mobile-1.0rc2.min.js" type="text/javascript"/> 
<script src="jquery.mobile.carousel.js" type="text/javascript" language="javascript"/> 
<script src="jquery.ui.ipad.js" type="text/javascript" language="javascript"/> 
<script type="text/javascript" language="javascript" > 
    $(document).ready(function($) { 
     $("#carousel1").carousel(); 
    })(jQuery); 
</script> 

我的建議是：

• Upgrade jQM to the latest version如您使用的是RC
• 正常關閉您的標籤通過@MarkRhodes
• 更新的建議與@feco建議的框架鏈接
• Use pageInit(), not $(document).ready()

可能看起來像：

<meta charset="utf-8"/> 
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/> 
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.css" /> 
<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script> 
<script src="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.js"></script> 

<!-- I'm asuming this is where you are getting these from --> 
<!-- https://github.com/blackdynamo/jQuery-Mobile-Carousel --> 
<script src="jquery-ui-1.8.7.custom.min.js" type="text/javascript" language="javascript"></script> 
<script src="jquery.mobile.carousel.js" type="text/javascript" language="javascript"></script> 
<script src="jquery.ui.ipad.js" type="text/javascript" language="javascript"></script> 


<script type="text/javascript" language="javascript" > 
    $('#pageId').live('pageinit',function(event){ 
     $("#carousel1").carousel(); 
    }); 
</script> 

Answer 2

您同時還使用它們並不總是允許自閉腳本標記。即切換

<script src="..." type="text/javascript"/> 

爲：

<script src="..." type="text/javascript"></script> 

見：Why don't self-closing script tags work?

Answer 3

好像你缺少了jQuery UI框架， 添加jQuery UI的你的頭標記

http://code.google.com/apis/libraries/devguide.html#jqueryUI

<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js" type="text/javascript"/> 

Answer 4

$(function(){ 
     $("#carousel1").carousel(); 
});