问题描述
查看在用jquery动态添加表行后如何突出显示表行我的代码似乎没有问题地添加行,但是没有突出显示正确的行
looking at how i can highlight a table row after dynamically adding it with jquerymy code seems to be adding the row with no problems, but its not highlighting the correct row
jquery
$('#opponents tr:last').after('<tr><td>data</td><td>more data</td></tr>').effect("highlight", {}, 3000);
haml/表
%table.twelve#opponents
%thead
%tr
%th Name
%th Manager
%tbody
- @opponents.each do |opponent|
%tr
%td= opponent.name
%td.span1
- if can? :update, @opponent
.btn-group
%button.btn.dropdown-toggle{"data-toggle" => "dropdown"}
%i.icon-pencil
Manage
%span.caret
%ul.dropdown-menu
%li= link_to "Edit #{opponent.name}", "#modalOpponent"
-if can? :manage, @opponent
%li.divider
%li= link_to "Delete #{opponent.name}", opponent, :method => :delete, :remote => :true, :confirm => true
推荐答案
我认为效果将应用于tr:last
,因为它是主要选择器.
I would assume that the effect would be applied to what ever tr:last
was as that is the main selector.
after()
从原始选择器$('#opponents tr:last')
返回jQuery对象,允许您继续链接到该主选择器.
after()
returns the jQuery object from the original selector $('#opponents tr:last')
allowing you to continue chaining on to that main selector.
演示 -使用现有代码,突出显示了错误的行
DEMO - Using existing code, wrong row is highlighted
尝试将新行分成自己的行,然后直接将效果应用到该行.与此类似:
Try separating the new row into it's own instead and applying the effect to it directly. Similar to this:
var $newRow = $('<tr><td>data</td><td>more data</td></tr>');
$('#opponents tr:last').after($newRow);
$newRow.effect("highlight", {}, 3000);
DEMO -以上代码的有效DEMO
DEMO - Working DEMO of above code
这篇关于动态添加表格行后突出显示表格行的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!