0 
<script type="text/javascript">
    $(document).ready(function () {
        $("tr.item").each(function () {
            var weight = $(this).children('td.Weight').text();
            var unit = "Kg";
            $(".Weight").text(weight + unit);

            });


    });
</script>
 html code...
  @foreach (var item in Model) {
   <tr class="item">
    <td>
        @Html.DisplayFor(modelItem => item.OrderId)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.CustomerId)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.OrderDate)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.OrderQty)
    </td>
    <td class="Weight">
        @Html.DisplayFor(ModelItem => item.TotalWeight, new { id="TotalWeight"})
    </td>
  </tr>

这些值继续与它们自己连接，例如：5000Kg，然后是 5000KgKg，然后是 5000KgKgKg 等等。我无法考虑当前值，代码会考虑所有行。

4

2 回答 2

2

改变

$(".Weight").text(weight + unit);

至

$(".Weight", this).text(weight + unit);

以便仅.Weight更改当前行的单元格。

以下评论的预览：

  • 在这里缓存选择器是没有用的，不会有任何明显的收益，而且它使代码更难阅读和维护
  • 使用children速度较慢，这不是很重要。重要的是 usingchildren背离了类的语义使用，它使您的代码依赖于.Weight元素是直接子元素而不是直接子元素这一事实，例如 aspan中的 a td。这与您通常应该优先closest于parent.
于 2013-07-30T09:10:55.797 回答
1

使用的选择器$(".Weight").text(weight + unit);选择所有具有“权重”类的元素，而不仅仅是当前元素中的tr元素。你确实通过使用找到了正确的元素，$(this).children("td.Weight")所以只需重复使用那个元素。

$("tr.item").each(function () {
  var $weight = $(this).children(".weight"),
      weight = $weight.text(),
      unit = "Kg";

  $weight.text(weight + unit);
});

顺便说一句：我建议您使用较短的选择器，在这种情况下.Weight就足够了并且与类名保持一致（使“Weight”小写）。

于 2013-07-30T09:16:50.817 回答