사용자가 테이블에 데이터를 추가하도록 허용 jquery

사용자가 자신의 데이터를 테이블에 입력해야합니다. 이것이 가능한가?

사용자가 자신의 ID, 점수 등을 입력 할 수있는 텍스트 필드를 만들고 싶습니다. 추가 버튼을 클릭하면 데이터가 테이블에 포함됩니다.

(현재 사용하지 않는 각 ID의 하이퍼 링크는 무시하십시오.)

코드 (내가 시도한대로 업데이트 됨)

<div data-role="main" class="ui-content">
    <div data-role="collapsible" data-collapsed="true">
         <h1>Top 10</h1>
        <button id="btn1">Add Scores</button>

<div data-role="fieldcontain">
    <label for="name">ID:</label>
    <input type="text" name="name" id="name" value=""  />
</div>  
<div data-role="fieldcontain">
    <label for="name">Score:</label>
    <input type="text" name="name" id="name" value=""  />
</div>  

<div data-role="fieldcontain">
    <label for="name">Course</label>
    <input type="text" name="name" id="name" value=""  />
</div>  



    <table data-role="table" id="table-column-toggle" data-mode="columntoggle" class="ui-responsive table-stroke">
      <thead>
        <tr>
          <th data-priority="2">Rank</th>
          <th>Student ID</th>
          <th data-priority="3">Course</th>
          <th data-priority="1">Meeting negotiated target</th>
          <th data-priority="5">Score (pts)</th>
        </tr>
      </thead>

      <tbody>
        <tr>
          <th>1</th>
          <td><a href="http://en.wikipedia.org/wiki/Citizen_Kane" data-rel="external">B</a></td>
          <td>Computing</td>
          <td><img src="tick.jpg"/></td>
          <td>229</td>
        </tr>
        <tr>
          <th>2</th>
          <td><a href="http://en.wikipedia.org/wiki/Casablanca_(film)" data-rel="external">B</a></td>
          <td>Network Computing</td>
          <td><img src="cross.jpg"/></td>
          <td>201</td>
        </tr>
        <tr>
          <th>3</th>
          <td><a href="http://en.wikipedia.org/wiki/The_Godfather" data-rel="external">B</a></td>
          <td>Computer Forensics</td>
          <td><img src="tick.jpg"/></td>
          <td>194</td>
        </tr>
        <tr>
          <th>4</th>
          <td><a href="http://en.wikipedia.org/wiki/Gone_with_the_Wind_(film)" data-rel="external">B</a></td>
          <td>Computing</td>
          <td><img src="tick.jpg"/></td>
          <td>194</td>
        </tr>
        <tr>
          <th>5</th>
          <td><a href="http://en.wikipedia.org/wiki/Lawrence_of_Arabia_(film)" data-rel="external">B</a></td>
          <td>Computing</td>
          <td><img src="cross.jpg"/></td>
          <td>159</td>
        </tr>
        <tr>
          <th>6</th>
          <td><a href="http://en.wikipedia.org/wiki/Dr._Strangelove" data-rel="external">B</a></td>
          <td>Computer Science</td>
          <td><img src="tick.jpg"/></td>
          <td>122</td>
        </tr>
        <tr>
          <th>7</th>
          <td><a href="http://en.wikipedia.org/wiki/The_Graduate" data-rel="external">B</a></td>
          <td>ICT</td>
          <td><img src="tick.jpg"/></td>
          <td>122</td>
        </tr>
        <tr>
          <th>8</th>
          <td><a href="http://en.wikipedia.org/wiki/The_Wizard_of_Oz_(1939_film)" data-rel="external">B</a></td>
          <td>Computing</td>
         <td><img src="cross.jpg"/></td>
          <td>100</td>
        </tr>
        <tr>
          <th>9</th>
          <td><a href="http://en.wikipedia.org/wiki/Singin%27_in_the_Rain" data-rel="external">B</a></td>
          <td>ICT</td>
          <td><img src="tick.jpg"/></td>
          <td>85</td>
        </tr>
        <tr>
          <th>10</th>
          <td class="title"><a href="http://en.wikipedia.org/wiki/Inception" data-rel="external">B</a></td>
          <td>Computer Science</td>
          <td><img src="cross.jpg"/></td>
          <td>78</td>
        </tr>
      </tbody>
    </table>

  </div>