Question

我这里有一个表格中的项目列表。每个项目右侧都有一个“选择”按钮。每当用户点击“选择”按钮时，按钮左侧的项目或文本应显示在span上。当我点击“选择”按钮时，所有项目都显示在span上。

我的代码如下：

<html>
<head>
 <script type="text/javascript" src="jquery.1.7.2.min.js"></script>
 <script type="text/javascript">
  $(function() {
   $(".btnSelectItem").click(function () {
    $("#spanItemDescription").html("<u>"+$(".tdItemDescription").text()+"</u>");
   });
  });
 </script>
</head>
<body>
 <div>
  <span>Item: </span>
  <span id="spanItemDescription">____________________________</span>
 </div>
 <table border=1>
  <tr>
   <td class="tdItemDescription">Shin Guard Small</td>
   <td><input type="button" class="btnSelectItem" value="Select"/></td>
  </tr>

  <tr>
   <td class="tdItemDescription">Shin Guard Medium</td>
   <td><input type="button" class="btnSelectItem" value="Select"/></td>
  </tr>

  <tr>
   <td class="tdItemDescription">Shin Guard Large</td>
   <td><input type="button" class="btnSelectItem" value="Select"/></td>
  </tr>
 </table>
</body>
</html>

请帮帮我。提前谢谢。

Answer 1

请试试这个

  $(function() {
            $(".btnSelectItem").click(function () {
                $("#spanItemDescription").html("<u>"+$(this).parent('td').siblings('.tdItemDescription').text()+"</u>");
            });
        });

FIDDLE DEMO

Answer 2

你必须得到正确的td

$("#spanItemDescription").html("<u>"+$(this).parent('td').prev(".tdItemDescription").text()+"</u>");

FIDDLE

Answer 3

$(function() {
        $(".btnSelectItem").click(function () {
            var text = $(this).parent().prev().text(); //the previous node of the parent of button
            $("#spanItemDescription").html("<u>"+text+"</u>");
        });
    });

这有效：）

jquery - 如何按类获取元素的值？

3 个答案: