1

ページ上の各texboxに2つのボタン(左側に1つ、右側に1つ)を作成するための次のコードがあります。アイデアは、インクリメント/デクリメントテキストボックスを作成することです。コードは1つのテキストボックスで正常に機能しますが、ボタンごとに2つ以上の場合、すべてのテキストボックスをインクリメント/デクリメントします。

ボタンをその場で作成し、インクリメント/デクリメントのためにテキストボックスにアタッチする方法はありますか?

jQuery.fn.incrementer =  function() {
    this.val(0);
    this.before("<input class='incrementer_minus' type='button' value=' - '/>");        
    var myobj = this;
    $(".incrementer_minus").live('click', function(){
        $(myobj).val(parseInt(JQ(myobj).val()) - 1);
    });
    this.after("<input class='incrementer_plus' type='button' value=' + '/>");
    $(".incrementer_plus").live('click', function(){
        $(myobj).val(parseInt(JQ(myobj).val()) + 1);
    });
}

JQ("#increment").incrementer();
JQ("#increment2").incrementer();
4

3 に答える 3

1

クリックイベントを次のすべてのインスタンスにincrementer_minus関連付けていますincrementer_plus

$(".incrementer_plus").live('click'...

代わりに、作成したばかりの特定のイベントにイベントを添付する必要があります。

そのようにコードを変更しました。また、必要がないため、bindの代わりに使用しました。livelive

私も便宜上に変更JQしました。jQuery元に戻すことができます。

テストしてください:http: //jsfiddle.net/mAsr9/

jQuery.fn.incrementer =  function() {
    var myobj = this;
    this.val(0);

      // Create new element, and insert before 'this'
    jQuery("<input class='incrementer_minus' type='button' value=' - '/>").insertBefore(this)

           // Then bind the click event to that new element
        .bind('click', function(){
            $(myobj).val(parseInt(jQuery(myobj).val()) - 1);
        });

      // Create new element, and insert after 'this'
    jQuery("<input class='incrementer_plus' type='button' value=' + '/>").insertAfter(this)

          // Then bind the click event to that new element
        .bind('click', function(){
            $(myobj).val(parseInt(jQuery(myobj).val()) + 1);
        });
}

$(function() {
    jQuery("#increment").incrementer();
    jQuery("#increment2").incrementer();
});
于 2010-07-02T13:08:24.450 に答える
0

あなたはスピナーを追いかけ
ています..プラグインのいくつかはここにあります..http:
//plugins.jquery.com/project/spinbox
http://docs.jquery.com/UI/Spinner
http://www.command-tab .com / 2007/05/07 / jquery-spinner-plugin /

于 2010-07-02T12:50:09.683 に答える
0

jQuery Incrementプラグインをご覧ください: http ://sean-o.com/increment

私はまさにそのような使用のためにそれを作成しました、うまくいけばそれはあなたの助けになることができます(まだ?)。

于 2010-11-29T14:53:52.720 に答える