如何动态地将div字段添加到html页面?

时间:2016-10-15 09:15:18

标签: javascript jquery html css jquery-append

我试图在点击按钮上动态添加div字段,但我没有得到回应。这是我的代码。

<div id="#para">
  <tr class="divider"></tr>
  <tr>
    <td><input type="text" placeholder="Enter Medicin Name" style="width:80%;height:30px;"></td>
    <td><input type="file" </td>
    <td><input type="time" placeholder="Enter Medicin Time"></td>
    <td><input type="date" placeholder="Enter Start Date"></td>
    <td><input type="date" placeholder="Enter End Date"></td>
  </tr>
  <tr class="divider"></tr>
</div>
<button type="submit" class="button" id="#btn1" value="Submit"><img src="images/plus.png"> Add More Notification</button>

这是我的Js代码

$(document).ready(function(){
  $("#btn1").click(function(){
    $("#para").append('  <tr class="divider"></tr> <tr class="notification-row"><td><input type="text" placeholder="Enter Medicin Name" style="width:80%;height:30px;"></td>  <td><input type="file" </td> <td><input type="time" placeholder="Enter Medicin Time"></td> <td><input type="date" placeholder="Enter Start Date"></td><td><input type="date" placeholder="Enter End Date"></td> </tr><tr class="divider"></tr>');
  });
});

1 个答案:

答案 0 :(得分:1)

试试这个

<div id="para">
  <tr class="divider"></tr>
  <tr>
    <td><input type="text" placeholder="Enter Medicin Name" style="width:80%;height:30px;"></td>
    <td><input type="file" </td>
    <td><input type="time" placeholder="Enter Medicin Time"></td>
    <td><input type="date" placeholder="Enter Start Date"></td>
    <td><input type="date" placeholder="Enter End Date"></td>
  </tr>
  <tr class="divider"></tr>
</div>
<button type="submit" class="button" id="btn1" value="Submit"><img src="images/plus.png"> Add More Notification</button>

你应该删除HTML脚本上的#

  HTML中的

(id)= jQuery(#)   在HTML(class)= jQuery(。)

你可以在google

上找到它