如何動態地從一個HTML頁面數據添加到列表中的另一

Question

我有一個HTML頁面上串項的列表，如下 -

<h1><b>Subject Groups</b></h1> 
     <div id="listContainer"> 
      <div class="listControl"> 
      </div> 
      <ul id="expList"> 
       <li> 
        Maths 
        <ul> 
         <li> 
          John Smith  
         </li> 
         <li> 
          Jane Smith 
         </li> 
         <li> 
          Elvis Presley 
         </li> 
        </ul> 
       </li> 
       <li> 
        Science 
        <ul> 
        <li> 
        Jane Smith 
        </li> 
        <li> 
        Kate Smith 
        </li> 
        </ul> 
       </li> 
       <li> 
        Literature 
        <ul> 
         <li> 
          Kate Smith 
         </li> 
         <li> 
          Tom Hanks 
         </li> 
        </ul> 
       </li> 
       <li> 
       <a href = "JavaScript:newPopup('new.html');"<b>New Student..</b></a> 
       </li> 
      </ul> 

在列表的末尾，有一個鏈接以彈出形式，它允許你輸入一個新的學生和通過複選框選擇什麼科目的那個人是studying-

<form action="" style= "font-size: 16pt"> 

<h3> First Name: </h3> 

    <div class="input-group"> 
     <input type="text" class="form-control"> 

     <h3> Last Name: </h3> 

    <div class="input-group"> 
     <input type="text" class="form-control"> 


     <h3> Email Address: </h3> 

    <div class="input-group"> 
     <input type="text" size="70" class="form-control"> 

    </div><!-- /input-group --> 

    <h3> Select the subjects that this student will study: </h3> 


<input type="checkbox" name="Maths" value="Maths"> &nbsp Maths<br> 
<input type="checkbox" name="Science" value="Science"> &nbsp Science<br> 
<input type="checkbox" name="Literature" value="Literature"> &nbsp Literature> 
<input type="button" class="btn btn-lg btn-primary btn-block" value="Submit" /> 
</form> 

我的問題是 - 我將如何去使用提交按鈕的onclick事件採取新創建的學生的名字和姓氏，並將其添加到相應的主題類別i中我的名單？這可能沒有一個數據庫後面呢？

Answer 1

我認爲這將是很容易使用jQuery做的......只要給每個科目的 一個ID喜歡如<li id="Maths">那麼當用戶提交表單獲得 複選框值和使用.append添加到列表例如

> $(chekBoxValue).append("<li>"+name+'</li>'); 

希望這有助於