FireFox中的Jquery？

我最近學習jquery，學習了html，CSS和JavaScript之後，發現了一個非常重要的細節（至少對我來說）。在完成一些基本代碼的編寫之後，修復錯誤，將其鏈接到頁面並打開它，我的腳本就不會加載。我最初的反應是我有錯，但事實並非如此！ http://www.codecademy.com/courses/web-beginner-en-bay3D/0/1?curriculum_id=50a3fad8c7a770b5fd0007a1是我正在學習Jquery的網站，它有一個很酷的（至少對我來說）使用它的最新例子。我複製了它的例子檢查50次，以確保它們正確鏈接，並且每次代碼都不做任何事情！FireFox中的Jquery？

現在我做我自己的一些研究，而據我可以告訴大家：

其他人有同樣的問題。
我可能需要一個在線源庫
目前還沒有正式提出質詢時

什麼解決方案，你可能有，我感謝你在前進，因爲我敢肯定，這將有助於很多誰有這個問題。我還沒有嘗試過其他瀏覽器（但），但無論如何解決問題，我不會將我的網站限制到某個瀏覽器。

類型的代碼：

HTML：

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Magic!</title> 
     <link rel="stylesheet" type="text/css" href="stylesheet.css"/> 
     <script src="jquery-1.10.1.min.js"></script> 
    <script type="text/javascript" src="script.js"></script> 
    </head> 
    <body> 
     <div id="red"></div> 
     <div id="blue"></div> 
     <div id="yellow"></div> 
     <div id="green"></div> 
    </body> 
</html>

CSS：

div { 
    height:100px; 
    width:100px; 
    display: inline-block; 
} 

#red { 
    background-color:#FF0000; 
} 

#blue { 
    background-color:#0000FF; 
} 

#yellow { 
    background-color:#E2BE22; 
} 

#green { 
    background-color:#008800; 
}

腳本：

$(document).ready(function() { 
    $('div').mouseenter(function() { 
     $(this).animate({ 
      height: '+=10px' 
     }); 
    }); 
    $('div').mouseleave(function() { 
     $(this).animate({ 
      height: '-=10px' 
     }); 
    }); 
    $('div').click(function() { 
     $(this).toggle(1000); 
    }); 
});

編輯：如果你請，寫劇本，你會使用。 P.S.我已經看過http://learn.jquery.com/about-jquery/how-jquery-works/，它並沒有解決我的問題。編輯2：我已經下載jquery-1.10.1.min.js並將它放在同一個文件夾中，並且已經鏈接了它（假設它是正確的）並且它沒有工作。我的代碼如上。

閱讀這個來幫助我：好吧，顯然我做錯了什麼。那麼有人可以做一個詳細的清單（去，點擊，下載，下載）和示例文本來嘗試一下，因爲嘗試這樣做12小時後開始變得有些神經過敏。在此先感謝^ _^

來源

2013-06-03 Reuben Renquist

它看起來不像你包含jQuery。我建議閱讀文檔：http://learn.jquery.com/about-jquery/how-jquery-works/。它解釋瞭如何正確設置所有內容。 –

你總是有錯。 ;-) –

在網站上說，要鏈接上面的jQuery腳本 –

會發生什麼是你沒有鏈接到jQuery。該網站（codeacademy）爲你喜歡jsfiddle或任何網絡基地「IDE」。

你可以下載here

然後在你的代碼添加這樣的參考：

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

來源

2013-06-03 21:02:34 Ben

或CDN：'

出人意料的是，你掛在培訓網站不包括鏈接到jQuery的！（在訓練網站恕我直言，大哎呀）。

您可以通過cdn添加指向<head>的鏈接。這樣你就不必下載任何東西（對於初學者來說更容易）。

<head> 
    <title>Magic!</title> 
    <link rel="stylesheet" type="text/css" href="stylesheet.css"/> 
    <script type="text/javascript" src="script.js"></script> 
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script> 
</head>

JsFiddle是一個很酷的地方可以玩這樣的代碼。爲了完整起見，其餘的代碼如下所示：

<script> 
    $(document).ready(function() { 
     $('div').mouseenter(function() { 
      $(this).animate({ 
       height: '+=10px' 
      }); 
     }); 
     $('div').mouseleave(function() { 
      $(this).animate({ 
       height: '-=10px' 
      }); 
     }); 
     $('div').click(function() { 
      $(this).toggle(1000); 
     }); 
    }); 
</script> 

<style> 
    div { 
    height:100px; 
    width:100px; 
    display: inline-block; 
} 

#red { 
    background-color:#FF0000; 
} 

#blue { 
    background-color:#0000FF; 
} 

#yellow { 
    background-color:#E2BE22; 
} 

#green { 
    background-color:#008800; 
} 

</style>

來源

2013-06-03 21:12:31

我試過了，沒有任何優勢 –

@ReubenRenquist請更具體一些，也許是一個錯誤，我將JSFiddle上的工作代碼鏈接起來，代碼在我的機器上運行良好。 –

相關問題

FireFox中的Jquery？

回答

相關問題