Computer >> คอมพิวเตอร์ >  >> การเขียนโปรแกรม >> Javascript

จะเพิ่มองค์ประกอบรายการใหม่ภายใต้
    โดยใช้ jQuery ได้อย่างไร


หากต้องการเพิ่มองค์ประกอบรายการใหม่ภายใต้องค์ประกอบ ul ให้ใช้ jQuery append() วิธีการ

ตั้งค่าข้อความประเภทอินพุตเริ่มต้น

Value: <input type="text" name="task" id="input">

เมื่อคลิกปุ่ม เพิ่มองค์ประกอบรายการใหม่โดยใช้เมธอด val() และผนวก () ใน jQuery:

$('button').click(function() {
   var mylist = $('#input').val();
   $('#list').append('<li>'+mylist+'</li>');
   return false;
});

คุณสามารถลองเรียกใช้โค้ดต่อไปนี้เพื่อเรียนรู้วิธีเพิ่มองค์ประกอบรายการใหม่โดยใช้ jQuery:<./p>

ตัวอย่าง

<!DOCTYPE html>
<html>
<head>
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
   <script>
      $(document).ready(function(){
         $('button').click(function() {
            var mylist = $('#input').val();
               $('#list').append('<li>'+mylist+'</li>');
               return false;
            });
         });
   </script>
</head>
<body>
   <form>
      Value: <input type="text" name="task" id="input">
      <button>Submit</button>
      <br>

      <p>Add a value above and click Submit to add a new list.</p>
      <ul id="list">
      </ul>
   </form>
</body>
</html>