0

サイズ変更可能なオブジェクトがいくつかあり、オブジェクトのサイズ変更を停止したときに関数 'changeS()' をトリガーしたいと考えています。
関数 changeS() は、呼び出されたオブジェクトの名前を最初の引数として受け取る必要があります。
つまり
、オブジェクト「#resizable0」のサイズ変更を停止すると、changeS(#resizable0,new_size - old_size) と
呼ばれる必要があり、オブジェクト「#resizable1」のサイズ変更を停止すると、changeS(#resizable1,new_size - old_size) と呼ばれる必要があります。 .

私が持っているすべてのオブジェクトに対してこのメ​​ソッドをコードに設定するだけですべて問題ありませんが、ループ for() で実行したいと思います。オブジェクトがさらに多くなり、問題が発生するからです。

var old_size=0;
var new_size=0;
var x,i;

for(i=0; i<5; i++){
x = "#resizable"+i;
var $res = $(x);

$res.resizable({
    grid: 22, minHeight:22, handles: 's',
    start: function(event,ui) {
        old_size = ui.originalSize.height;
    },
    stop: function(event,ui) {
        new_size = ui.size.height;

        if(new_size!=old_size)
            changeS($res,new_size - old_size);
    }
});
}

オブジェクトの名前を関数の引数として正しく渡す方法がわかりません。
関数 changeS() が実行されると、常に同じ名前 (最後に作成されたオブジェクトの名前 (この場合は "#resizable5")) で呼び出されます。

私の質問は次のとおりです。
関数 changeS() が対応する引数(このオブジェクトの名前)で呼び出された各オブジェクトを作成するにはどうすればよいですか?

ありがとう、ポップコーン

4

1 に答える 1

1

ループで作成している関数はクロージャーです。関数が定義されたときの値のコピーではなく、閉じた変数への永続的な参照を保持します。したがって、それらのすべては、「彼らの」ループ中の値ではなく、最後に割り当てた値を参照します。$res

これを解決する通常の方法は、次のようなファクトリ関数を使用することです。

var x,i;

for(i=0; i<5; i++){
    x = "#resizable"+i;
    var $res = $(x);

    makeResizeable($res);
}

function makeResizeable($thisres) {
    var old_size = 0,
        new_size = 0;

    $thisres.resizable({
        grid: 22, minHeight:22, handles: 's',
        start: function(event,ui) {
            old_size = ui.originalSize.height;
        },
        stop: function(event,ui) {
            new_size = ui.size.height;

            if(new_size!=old_size)
                changeS($thisres,new_size - old_size);
        }
    });
}

内部で作成する関数に焼き付けられた引数は変更されないため、 ではなく$thisres、ファクトリ関数に渡される引数であるを使用する方法に注意してください。また、そのファクトリ関数にも移動したことに注意してください。イベント ハンドラーはそのデータを閉じるため、それらの各ペアはそれらの変数の独自のプライベート コピーを取得します。makeResizeable$resmakeResizeablenew_sizeold_size

クロージャーは複雑ではありませんが、人々が誤解しがちな基本的なことがいくつかあります。ただし、それらを下ろすと、体調が良くなります。

于 2011-06-03T09:08:46.267 に答える