0

我已经关注了表格的 HTML。实际表太大。供您参考，我只显示了这个大型 HTML 表中的两行：

<table   id="blacklistgrid"  class="table table-bordered table-hover table-striped">
  <thead>
    <tr  id="Row1">
      <th style="vertical-align:middle" >Pack Of</th>
      <th style="vertical-align:middle">Quantity</th>
      <th style="vertical-align:middle">Volume</th>
      <th style="vertical-align:middle">Unit</th>
      <th style="vertical-align:middle">Rebate Amount</th>
    </tr>
  </thead>
  <tbody class="apnd-test">
    <tr id="reb1">
      <td><input type="text" name="pack[1]" id="pack_1" value="100" class="form-control" size="8"/></td>
      <td><input type="text" name="quantity[1]" id="quantity_1" value="10" class="form-control" size="8"/></td>
      <td><input type="text" name="volume[1]" id="volume_1" value="1000" class="form-control" size="8"/></td>
      <td>
        <div class="btn-group">
          <select id="units_1" name="units[1]" class="form-control">
            <option value="" >Select Unit</option>
            <option value="5" >Microsecond</option>
            <option value="7" >oz</option>
            <option value="9" >ml</option>
            <option value="10" >L</option>
            <option value="12"  selected="selected">gms</option>
          </select>
        </div>
      </td>
      <td><input type="text" name="amount[1]" id="amount_1" value="3.00" class="form-control" size="9"/><button class="close" aria-hidden="true" data-dismiss="alert" onclick="delete_rebate(this.id);return false;" type="button" style="margin: -26px -14px;float: right; color:#C00; opacity: 2;">×</button></td>
    </tr>
    <tr id="reb2">
      <td><input type="text" name="pack[2]" id="pack_2" value="200" class="form-control" size="8"/></td>
      <td><input type="text" name="quantity[2]" id="quantity_2" value="20" class="form-control" size="8"/></td>
      <td><input type="text" name="volume[2]" id="volume_2" value="2000" class="form-control" size="8"/></td>
      <td>
        <div class="btn-group">
          <select id="units_2" name="units[2]" class="form-control">
            <option value="" >Select Unit</option>
            <option value="5" >Microsecond</option>
            <option value="7" >oz</option>
            <option value="9" >ml</option>
            <option value="10"  selected="selected">L</option>
            <option value="12" >gms</option>
          </select>
        </div>
      </td>
      <td><input type="text" name="amount[2]" id="amount_2" value="6.00" class="form-control" size="9"/><button class="close" aria-hidden="true" data-dismiss="alert" onclick="delete_rebate(this.id);return false;" type="button" style="margin: -26px -14px;float: right; color:#C00; opacity: 2;">×</button></td>
    </tr>
  </tbody>
</table>

我写的jQuery函数如下：

function delete_rebate(field) {
  $('#'+field).remove();    
}

但它不起作用。任何人都可以在这方面帮助我吗？如果您想了解有关该问题的更多信息，我可以为您提供相同的信息。

4

3 回答 3

0

查看对函数的调用会很有帮助。

我认为您可能对 id 提出了一个常见问题。

执行控制台日志以查看删除回扣中字段的值。

请记住，编写一个只执行这样一项短任务的函数会减慢并弄乱您的代码。

只需使用ELEMENT.remove();它的干净和简单。

如果这不起作用，请查看 jquery EQ 函数

于 2014-04-27T16:01:34.823 回答
0

你确定调用函数 delete_rebate() 吗？如果是这样，您可能会尝试在文档完全加载之前调用该函数。我用 tr (id="reb2") 试过了，它奏效了：

    $(document).ready(function(){
        delete_rebate('reb2');
    });

    function delete_rebate(field) {
       $('#'+field).remove();    
    }

JSFiddle：http: //jsfiddle.net/cAS9v/3/

于 2014-04-27T16:02:32.410 回答
0

您通过单击按钮调用您的函数并使用this.id. 然而在这个上下文中this是指按钮。相反，您需要查找表格行。也不要将您的事件处理程序硬编码到 HTML 中，分配它们：

$(".apnd-test button.close").click(function() {
  $(this).closest("tr").remove();
});
于 2014-04-27T16:35:46.503 回答