1

各行に 1 つのボタンがあるテーブルがあり、ボタンをクリックすると、その行に表示されている税金がクライアントに適用され、エンド ユーザーに何らかの指示を表示する必要があります。そのために、クリック時にボタンのcss（色、txtなど）を変更したいと思います。以下はコードです -

<table class="data report_table">       
                        <tbody>
                        <c:forEach var="taxVO" items="${taxVo}" varStatus="item">
                        <tr class="${item.index % 2 == 0 ? 'odd gradeX' : 'even gradeC'}">                          
                            <td><c:out value="${taxVO.taxName}" /></td>
                            <td><input type="button" class="btn-icon" value="Apply" id="applyTaxButton" onClick="applyTax('${taxVO.taxId}');"></input>
                            </td>   
                        </tr>
                        </c:forEach>
                        </tbody>
                    </table>

そして、私が使用しているjqueryは -

function applyTax(taxIdValue)   {
    $('#taxId').val(taxIdValue);
    $(this).$('#applyTaxButton').css("background-color","yellow");
}

しかし、エラーが発生しています - Uncaught TypeError: Object [object Object] has no method '$'. 誰かがそれを修正する方法を教えてもらえますか?

4

2 に答える 2

2

jsFiddle デモ

HTML ID は一意である必要があるため、すべてのボタンに同じ ID を設定しないでください。そのためには class 属性を使用します。ただし、選択のコンテキストを単純に変更するための正しい構文は次のとおりです。

$(selector, context);

より良いアプローチは、属性を完全に削除onclickし、jQuery でイベントを完全に処理することです。

$(function() {
    $('.report_table').on('click', '.btn-icon', function() {
        $(this).css('background-color', 'yellow');
        $('.btn-icon').not(this).css('background-color', 'transparent');
    });
});​
于 2012-10-14T17:38:20.390 に答える
1 
<input id="taxId" type="text" /><br />

<input onclick="applyTax(this, '1');" value="Apply" class="btn-icon btn-small btn-grey" type="button" />
<input onclick="applyTax(this, '2');" value="Apply" class="btn-icon btn-small btn-grey" type="button" />
<input onclick="applyTax(this, '3');" value="Apply" class="btn-icon btn-small btn-grey" type="button" />


<script>
function applyTax(btn, taxIdValue)   {
    $('#taxId').val(taxIdValue);
    $(btn).css("background-color","yellow");
}
</script>

デモ: http://jsfiddle.net/NFGkj/

ただし、jquery イベント バインディングを使用することをお勧めします。

于 2012-10-14T17:48:54.883 に答える