如何在两个tr之间添加tr或任何html标记

时间:2015-01-29 09:25:42

标签: html html-table

以下是我正在使用的html我想在前两个trs之间添加一个tr,但它不起作用。 我想添加一个html标签并包含前两个tr的类。我怎样才能做到这一点?我不想在其中包含提交按钮的tr。

<table cellspacing="0" id="content-space" class="content-space">

         

<tr>
  <td>
    Subscription Plan:
  </td>
  <td>
    <select id="PlanNameId" style="width:auto !Important" name="data[][PlanNameId]">
      <option value="4">
        Disable
      </option>
      <option selected="selected" value="2">
        Free
      </option>
      <option value="1">
        Bronze
      </option>
    </select>

  </td>
  <td>
    &nbsp;
  </td>

</tr>


<tr>
  <td>
    Auto Upgrade:
  </td>
  <td>
    <select id="SubscriptionSetting" name="data[][SubscriptionSetting]">
      <option value="1">
        Yes
      </option>
      <option selected="selected" value="0">
        No
      </option>
    </select>

  </td>
  <td>
    &nbsp;
  </td>

</tr>

<tr>
  <td colspan="2" class="signin-button-containers">
    <input type="submit" value="Submit" id="subscriptionsubmit" class="primaryLargeButton">

  </td>
</tr>

2 个答案:

答案 0 :(得分:1)

您可以简单地获取第一个tr,然后在其后面插入新行。使用jQuery这很容易,但是没有任何库,它也可以毫不费力地完成。

$("table tr").first().after("<tr><td>Inserted data</td><td>More data in between</td></tr>")

示例:http://jsfiddle.net/qnu3c0uk/1/

答案 1 :(得分:0)

鉴于:

<table>
    <tr>
        <td>Text</td>
    </tr>
    <tr>
        <td>Text 2</td>
    </tr>
<table>

并且你要在我要做的第一个表行之后插入一个表行(带一个单元格):

$("table tr:first-of-type").after($("<tr>").append("<td>"));

如果您想在第一行和新行中添加一个类,我会这样做:

$("table tr:eq(0),table tr:eq(1)").addClass("row-class");

或实际上将这两部分组合成:

var $newRow = $("<tr>").addClass("new-class");
var $firstRow = $("table tr:first-of-type").addClass("new-class");
$firstRow.after($newRow.append("<td>"));