1

変数 (要素の値ではありません!) をインクリメントおよびデクリメントする jQuery プラグインを作成しようとしています。これは機能しますが、複数のインスタンスが同じ変数をインクリメントしており、それぞれに対して分離された値が作成されていません。
これは私のコードです：

(function( $ )
{

var current_value = 5;
var maxs = 10;
var container_id;

$.fn.moveLeft = function(container_id){
    return this.each(function()
    {
        if (current_value+1 <= maxs)
            {
            current_value++;
            $("#"+container_id).animate({
                marginLeft: "-=194px",
                },200);

            }
    });
    }
$.fn.moveRight = function(container_id){
    return this.each(function()
    {
        if (current_value-1 >= 1)
            {
            current_value--;
            $("#"+container_id).animate({
                marginLeft: "+=194px",
                },200);
            }
    });
    }

})(jQuery);

HTML部分：

<div id="back" onclick="$('#back').moveLeft('s1');" >BACK</div><div id="fward" onclick="$('#fward').moveRight('s1');" >FWARD</div>
<div id="s1">SOME CONTENT 1</div>

<div id="back2" onclick="$('#back2').moveLeft('s2');" >BACK</div><div id="fward2" onclick="$('#fward2').moveRight('s2');" >FWARD</div>
<div id="s2">SOME CONTENT 2</div>

私が必要とするのはcurrent_value、インスタンスごとに別々にすることです。誰かが私を案内できますか？私はjQueryの初心者です...

4

1 に答える 1

1

Plugin Authoringのドキュメントによると、 .data()を使用して状態を保存できます。

$.fn.moveLeft = function(container_id) {
    return this.each(function() {
        var $this = $(this), moveLeftValue = $this
            .data('moveLeftValue')
            || 5;

        if (moveLeftValue < maxs) {
            $("#" + container_id).animate({
                        marginLeft : "-=194px"
                    }, 200);
            $this.data('moveLeftValue', moveLeftValue + 1);
        }
    });
}
于 2013-04-09T13:35:32.630 に答える