2016-11-09 32 views
0

jqueryスクリプトを読み込もうとしていますが、ページを読み込むとアラートメッセージが表示されません。ファイルmain.jsはindex.htmlページと同じフォルダに保存されていますので、これを使用してページを呼び出しましたが、何も起こっておらず、間違っているとは見えません。ここでjqueryアラートが表示されない

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

私のhtml:

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
     <title>Bootstrap Example</title> 
     <meta charset="utf-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1"> 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
     <link rel="stylesheet" href="main.css"> 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css"> 
    </head> 

    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. In veniam doloremque voluptate debitis quaerat ipsum, officia, ad exercitationem placeat quasi nobis enim itaque. Adipisci ullam magnam sequi eum maiores, quia!</p> 

    <script type="text/javascript" src="main.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
</body> 
</html> 

のjQuery:

(function($) { 
    $(document).ready(function(){ 
     alert('This shit is not working'); 
    }); 
})(jQuery); 
+1

をそれを試してみてください:// ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js "> –

+0

@Azeez Kallayiあなたはちょうど正しいです –

答えて

7

が、あなたはそれを使用することができ、あなたはjQueryのを含めるように最初必要この

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
     <title>Bootstrap Example</title> 
     <meta charset="utf-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1"> 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
     <link rel="stylesheet" href="main.css"> 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css"> 
    </head> 

    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. In veniam doloremque voluptate debitis quaerat ipsum, officia, ad exercitationem placeat quasi nobis enim itaque. Adipisci ullam magnam sequi eum maiores, quia!</p> 


    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
    <script type="text/javascript" src="main.js"></script> 
</body> 
</html> 

のようにしてみてください。

0

jqueryライブラリをロードしてから、jqueryコードをロードする必要があります。

<script type="text/javascript" src="main.js"></script> 
0
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
<script type="text/javascript" src="main.js"></script> 

あなたがます。を移動する必要が一度

関連する問題