Question

在这个JSFiddle demo中，我试图动态添加一行，只知道该表的前一个元素之一的id。代码完美无缺，否则我想美化它。特别是我希望使用以下属性突出显示新插入的行：

.effect("highlight",  color: '#4BADF5'}, 1000);

有什么建议吗？感谢

Answer 1

首先 - 你需要添加jQuery UI lib。

第二 - 你的算法不是最佳算法。

请在下面找到最佳解决方案：

var myClick = function() {
  var nome = "Hello";
  var rowId = "120"
  var row = "<tr><td>" + nome + "</td></tr>";
    
  var newTr = $(".mytable1 tr #" + rowId).parent().after(row);
  newTr.next().effect("highlight", { }, 2000);
};

$('#button').click(myClick);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<link href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>
<input type="button" id="button" value="Add"/>
<table class="mytable1">
  <tr><td id="12">1.0</td></tr>
  <tr><td id="20">1.1</td></tr>
  <tr><td id="120">1.2</td></tr>
  <tr><td id="260">1.3</td></tr>
  <tr><td id="2">1.4</td></tr>
  <tr><td id="100">1.5</td></tr>
  <tr><td id="23">1.6</td></tr>
</table>

如何在javascript中动态设置效果

1 个答案: