4

http://jsfiddle.net/Lijo/sP7zD/にリストされているHTMLテーブルがあります。最初の列のヘッダーの値を読み取る必要があります。私は「gt」と「lt」演算子を使ってそれを行っています。ただし、最初の列の値は取得されていません。

  1. 私が書いたスクリプトでは、どのようなjQueryコードの変更を行う必要がありますか？
  2. 最初の列のヘッダーの値を読み取るためのより良い方法は何ですか？

コード

<input type="submit" value="Alert" class="alertButton"/>


<table class="resultGridTable" cellspacing="0" id="detailContentPlaceholder_grdLocalTaxReport"
style="border-collapse: collapse;">
<tr>
    <th scope="col">
        IsSummaryRow
    </th>
    <th scope="col">
        Associate
    </th>
    <th scope="col">
        Gross Amount
    </th>
    <th scope="col">
        Federal Withholding
    </th>


</tr>
<tr>
    <td>
        False
    </td>
    <td>
        Norman Tylor
    </td>
    <td>
        3450
    </td>
    <td>
        32
    </td>
</tr>
</table>

<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.4.1.js"></script>

スクリプト

$('.alertButton').click(function() {                                                  
    var selectedElements = $("tr").find("th:gt(0):lt(1)");
    $(selectedElements).css('background-color','yellow');
    alert(selectedElements.html());
});

</ p>

4

4 に答える 4

3

使用する$('th:first')

var selectedElements = $("th:first");

これがデモです。

コードの場合：eq代わりに使用するように変更します。

var selectedElements = $("tr").find("th:eq(0)");
于 2012-09-19T08:12:02.820 に答える
1

質問1に答えるために、コードは0より大きいインデックスを持つ要素を見つけようとするので、2番目を見つけます。を削除してみてくださいgt。これにより、インデックスが1未満の要素が検出されるため、インデックスが0の要素と一致します。

var selectedElements = $("tr").find("th:lt(1)");

しかし、他の回答で述べられているように、これを行うためのより良い方法があります。

于 2012-09-19T08:15:49.217 に答える
1

これを試して

HTMLコード

<input type="submit" value="Alert" class="alertButton" />
<table class="resultGridTable" cellspacing="0" id="detailContentPlaceholder_grdLocalTaxReport"
style="border-collapse: collapse;">
    <tr>
        <th scope="col">
            IsSummaryRow
        </th>
        <th scope="col">
            Associate
        </th>
        <th scope="col">
            Gross Amount
        </th>
        <th scope="col">
            Federal Withholding
        </th>
    </tr>
    <tr>
        <td>
            False
        </td>
        <td>
            Norman Tylor
        </td>
        <td>
            3450
        </td>
        <td>
            32
        </td>
    </tr>
</table>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.4.1.js">
</script>

JSコード

$('.alertButton').click(function()
    {                                                 
        var selectedElements = $('th').first();
            alert(selectedElements .text());
        selectedElements.css({'background':'yellow'});                 
});

デモ

于 2012-09-19T08:49:48.130 に答える
0

使用するvar selectedElements = $(".resultGridTable").find("tr:first").find('th:first');

$('.alertButton').click(function()
{

var selectedElements = $(".resultGridTable").find("tr:first").find('th:first');
    $(selectedElements).css('background-color','yellow');
    alert(selectedElements.html());


});

</ p>

于 2012-09-19T08:13:21.013 に答える