Question

 <script type="text/javascript">
     $(document).ready(function () {
         $('table tr td a').click(function (event) {
             alert(event.target.id);
             var ClassName = event.target.id;
             var Pref = '.'
             var ClassFull = Pref + ClassName;
             var TdText = $(ClassFull).text();
             alert(TdText);
         });
     });
 </script>

MARKUP：

    <p>
        Account No:
        <input id="AcctNo" type="text"/>
        <input type="submit" id="submit" name="Submit" value="Submit" />
    </p>
    <table>
        @foreach (var item in Model)
        {
           <tr>
              <td>
                 <a id ="@Html.DisplayFor(modelItem => item.EmployerName)" 
                    href ="#">@Html.DisplayFor(modelItem => item.EmployerName)</a>
              </td>
              <td class = "@Html.DisplayFor(modelItem => item.EmployerName)" >
                 @Html.DisplayFor(modelItem => item.AcctNo)
              </td>
           </tr>
        }
    </table>

我得到了发件人的id，并且有一个td，其classname与发件人的id相同，然后获取其中的文本。似乎没有返回我想要的文本

Answer 1

我假设的问题是，employerName可以包含空格和特殊字符，这些字符会改变选择器的含义。

在这种情况下，您需要单击元素的父级的下一个兄弟的文本

$(document).ready(function () {
    $('table tr td a').click(function (event) {
        var TdText = $(this).parent().next().text();
        alert(TdText);
    });
});

或者您可以使用预定义的类名，例如

<table>
    @foreach (var item in Model)
    {
        <tr>
            <td>
                <a class="employer-name" id ="@Html.DisplayFor(modelItem => item.EmployerName)" href ="#">@Html.DisplayFor(modelItem => item.EmployerName)</a>
            </td>
            <td class = "acctNo" >
                @Html.DisplayFor(modelItem => item.AcctNo)
            </td>
        </tr>
    }
</table>

然后找到父类（td）兄弟与班级acctNo一样

$(document).ready(function () {
    $('table a.employer-name').click(function (event) {
        var TdText = $(this).parent().siblings('.acctNo').text();
        alert(TdText);
    });
});

Answer 2

我同意问题可能是因为EmployerName中有空格，但是还有其他一些方法可以获取数据。

注意我将click事件处理程序移动到tr标记。您可以使用html5数据属性来存储任何html标记的任何信息。或者您可以像访问一样访问文本。

<p>
    Account No:
    <input id="AcctNo" type="text"/>
    <input type="submit" id="submit" name="Submit" value="Submit" />
</p>
<table>
    @foreach (var item in Model)
    {
       <tr>
          <td class="EmployerName" 
                data-name="@Html.DisplayFor(modelItem => item.EmployerName)" 
                data-acctno="@Html.DisplayFor(modelItem => item.AcctNo)">
                    @Html.DisplayFor(modelItem => item.EmployerName)
          </td>
          <td class="AcctNo" >
             @Html.DisplayFor(modelItem => item.AcctNo)
          </td>
       </tr>
    }
</table>

 <script type="text/javascript">
     $(document).ready(function () {
         $('tr').click(function (event) {
             var TdText = $(this).find('.EmployerName').text();
             var Td2Text = $(this).find('.AcctNo').text();
             var Td3Text = $(this).find('.EmployerName').data('acctno');
             alert(TdText);
         });
     });
 </script>

如何使用string作为类名并在函数中调用它

2 个答案: