我如何添加键盘快捷键输入到jQuery的待办事项列表

Question

I'm new to jquery and I'm making my first project which is a basic to do list. Im trying to make it work when someone presses enter but for some reason nothing is happening.

 $(document).ready(function() { $("#btn2").click( function() { var toAdd = $("#listItem").val(); $("ol").append("<li>" + toAdd + "</li>"); }); }); $(document).on('dblclick', 'li', function() { $(this).toggleClass('strike').fadeOut('slow'); }); $('#listItem').keypress(function(event) { var keycode = (event.keyCode ? event.keyCode : event.which); if (keycode == '13') { var toAdd = $("#listItem").val(); $("ol").append("<li>" + toAdd + "</li>"); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> <form name="toDoList"> <input type="text" id="listItem" name="ListItem" /> </form> <ol> </ol> <button id="btn2">Add something</button> <p>something</p> <p>ldldl</p> 

Answer 1

• added ALL the event handling to the load event
• closed the brackets
• removed ) from if
• added class
• event.which is normalised by jQuery

 $(function() { $("#btn2").click(function() { var toAdd = $("#listItem").val(); $("ol").append("<li>" + toAdd + "</li>"); }); $("#listItem").keypress(function(e) { var keycode = e.which; if (keycode == '13') { var toAdd = $("#listItem").val(); $("ol").append("<li>" + toAdd + "</li>"); } }); }); $(document).on('dblclick', 'li', function() { $(this).toggleClass('strike').fadeOut('slow'); }); 

 .strike { text-decoration:line-through} 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> <form name="toDoList"> <input type="text" id="listItem" name="ListItem" /> </form> <ol> </ol> <button id="btn2">Add something</button> <p>something</p> <p>ldldl</p>