0

3列のテーブルがあります。最後の列は、そのリンクをクリックしたときのリンクです。特定の行の値をアラートとして表示する必要があります。

<table border="1">
    <tr>
        <th>
            id
            </th>
        <th>
            name
        </th>
          <th> 
            Occupation
        </th>
        <th>
            click the link
        </th>
    </tr>

@foreach (var i in Model.allHuman)
{
    <tr>
        <td>
            @Html.DisplayFor(mo => i.id)
        </td>
        <td>
            @Html.DisplayFor(mo => i.name)
        </td>
         <td>
            @Html.DisplayFor(mo => i.occupation)
        </td>
        <td>
            <a href='' id='ppl' name='ppl' class='humanclass'> display </a>
        </td>

ユーザーがリンクをクリックすると、その特定の行の内容を含むアラートが表示されます。コンテンツは、とIDが後に続く形式である必要がNAMEありますOCCUPATION。

JQuery メソッド:

  $(function () {
        $('.humanclass').click(function () {
            alert( ?????????? );   // How to display ID, NAME and OCCUPATION of the ROW          
        });
    });
4

2 に答える 2

2

data可能な解決策の1つ: 次のようにリンクに属性を追加します:

<a href='' id='ppl' name='ppl' class='humanclass' data-id='@(i.id)' data-name='@(i.name)' data-occupation='@(i.occupation)' "> display </a>

そしてそれをjquery関数で取得します

$(function () {
    $('.humanclass').click(function () {
        alert($(this).data("id"), $(this).data("name"), $(this).data("occupation"));  
    });
});
于 2013-02-27T15:32:44.003 に答える
2

jQuery 親関数を使用して、クリックした現在の行のコンテキストを取得できます。

$('.humanclass').click(function () {
    var rowContext = $(this).parent('tr');
    var id = $("td:nth-child(0)", rowContext).val();
    var name = $("td:nth-child(1)", rowContext).val();
    var occupation = $("td:nth-child(2)", rowContext).val();
    alert(id+' '+name+' '+occupation);
});
于 2013-02-27T15:40:47.090 に答える