剛開始學習jQuery和代碼不工作

我正在通過初學者的教程，並且我的代碼已經不起作用了。我無法瞭解我的生活，看看我的代碼與提供的教程代碼有什麼不同。誰能告訴我什麼是錯的？剛開始學習jQuery和代碼不工作

HTML：

<!DOCTYPE html><html> 
<head> 
<title>To Do List</title> 
<link rel="stylesheet" type="text/css" href="style.css"/> 
<script type="text/javascript" src="script.js"></script> 
</head> 
<body> 
<h1>To Do List</h1> 
<form name="checkListForm"> 
    <input type="text" name="checkListItem" value="Add to do item> here!"/> 
</form> 
<button>Add</button><br/> 
<div id="toDoItems"> 
</div> 
</body> 
</html>

JS：

$(document).ready(function() { 
    $('button').click(function() { 
     var toAdd = $("input[name=checkListItem]").val(); 
     $('#toDoItems').append("<p>"toAdd"</p>"); 
    }); 
});

來源

2014-02-27 alice

你需要在你的頁面中包含jquery庫 –

包括jQuery庫，包括你的腳本中使用+

$(document).ready(function() { 
    $('button').click(function() { 
     var toAdd = $("input[name=checkListItem]").val(); 
     $('#toDoItems').append("<p>" + toAdd + "</p>"); 
     //      ----^-------^------ 
    }); 
});

Fiddle Demo

如果它不那麼工作，而不是包括外部腳本文件包括

<!DOCTYPE html><html> 
    <head> 
     <title>To Do List</title> 
     <link rel="stylesheet" type="text/css" href="style.css"/> 
     <!-- including jQuery library            --> 
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"> 
     </script> 

     <script type="text/javascript" src="script.js"></script> 
    </head> 
    <body> 
     <h1>To Do List</h1> 
     <form name="checkListForm"> 
      <input type="text" name="checkListItem" value="Add to do item> here!"/> 
     </form> 
     <button>Add</button><br/> 
     <div id="toDoItems"> 
     </div> 
    </body> 
</html>

並連接字符串之前代碼在頁面中，它是w完美的工作會有我的瀏覽器

<!DOCTYPE html><html> 
    <head> 
     <title>To Do List</title> 
     <link rel="stylesheet" type="text/css" href="style.css"/> 
     <!-- including jQuery library            --> 
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"> 
     </script> 

     <script type="text/javascript"> 
      $(document).ready(function() { 
       $('button').click(function() { 
        var toAdd = $("input[name=checkListItem]").val(); 
        $('#toDoItems').append("<p>" + toAdd + "</p>"); 
        //      ----^-------^------ 
       }); 
      }); 
     </script> 
    </head> 
    <body> 
     <h1>To Do List</h1> 
     <form name="checkListForm"> 
      <input type="text" name="checkListItem" value="Add to do item> here!"/> 
     </form> 
     <button>Add</button><br/> 
     <div id="toDoItems"> 
     </div> 
    </body> 
</html>

如果它的工作，然後會有一些問題，你的腳本script.js的路徑。

來源

2014-02-27 16:24:16

您需要您的scripts.js

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

包括jQuery的，以及使用+在javascript來連接你的價值：

$('#toDoItems').append("<p>" + toAdd +"</p>");

來源

2014-02-27 16:21:36 Felix

謝謝，我不知道鏈接到jquery庫。 V多初學者！但是，它仍然沒有工作...... ?? （我也加了'+'） – alice

它仍然沒有工作，但！我在HTML頁面中添加了jquery庫的鏈接並添加了+。還有什麼我失蹤？ – alice

@ user3361367：點擊此處查看http://jsfiddle.net/pranavcbalan/C6WpC/1/ –

剛開始學習jQuery和代碼不工作

回答

相關問題