1

jQuery Template を使用して情報のテーブルを作成しています。各行には、マイナス ボタン、プラス ボタン、およびそれらの間のテキスト ボックスが含まれます。一部テキストもあります。マイナスまたはプラス ボタンをクリックすると、テキスト ボックス内の数値が増減します。これらはすべてテンプレートを介して動的にレンダリングされるため、ボタンはどのように機能しますか? テストとして次のことを試しましたが、すべてのマイナスボタン要素でクリック関数を呼び出すだけです:

jQuery('#template').tmpl(data).appendTo("#holdingCell");

    jQuery('#holdingCell #minusbutton').click(
        function(){
            alert(this.id);
        });

これが私のコードの関連部分です。これを機能させる方法について誰か提案がありますか?

<script id="template" type="text/x-jquery-tmpl">
    <div style="display:block;margin-bottom:20px;" id="${getNextId()}">
      <div class="adjuster"><button id='minusbutton'>-</button><input id='quantityText' class="enterQuantity" type=text style="width:40px; margin-left:5px;margin-right:5px" /><button id=">+</button></div> 
      <div class="productName" style="width:200px"><div>${productname}</div></div>
      <div class="quantity"><span style="font-weight:bold;">${quantity}</span><span> Remaining</span></div>
    </div>

function getNextId(){
return id++;
}

function buildDialog(json){
//Stuff I didn't paste here turns the parameter 'json' into a variable 'data'

 jQuery('#template').tmpl(data).appendTo("#holdingCell");

    jQuery('#holdingCell #minusbutton').click(
        function(){
            alert(this.id);
        });
4

2 に答える 2

3

テンプレートを変更して、各ボタンに onclick を追加できます。次に、関数に送信する必要があるパラメーターを渡します。

<div class="adjuster"><button id='minusbutton' onClick='minusClick(${id});'>-</button>


function minusClick(id) {
    alert(id);
 }
于 2012-04-17T15:16:35.073 に答える
1
$(function(){ //that means on page load
    $("#minusbutton").click(function(){
        var $item = $(this).parent().$("#quantityText");
        var current_value = $item.val();
        current_value = parseInt(current_value);
        if (current_value - 1 >= 0)
        {
             $item.val(current_value - 1);
        }
    })
});

これがマイナスボタンのロジックです。同じロジックで plus と同等のことを行います。

于 2012-04-17T15:11:33.247 に答える