1

我有以下代码为页面上的每个 texbox 创建两个按钮（一个在左侧，一个在右侧）。想法是制作一个递增/递减文本框。代码适用于一个文本框，但每个按钮增加/减少所有文本框有 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了代替live，因为您不需要live.

为了方便，我也改成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 回答