jqueryの変数を関数の外に出す方法

質問

すみません非常に困っております。

setMove()の中のspeedを関数の外に出したいのですが、
どのようにすればよろしいでしょうか。
引数などを使用すればいいのだとおもいますが、
やり方がわからず。申し訳ございませんがご教示のほど
よろしくお願いいたします。

var target = $('ul#mainNavi li').find('.light');
var speed = 1000;
var t = setInterval(setMove() , speed);

function setMove(){
target.animate({left:600} , 1000 , 'swing' , function(){
$(this).css('left' , -118) ;
speed = 3000;

});
}

回答No.3

Ogre7077 · ベストアンサー

いささか無駄が多いですが、こんなのはどうでしょうか

function setMove() {
var target = $('ul#mainNavi li').find('.light');
target.animate({left: '600'}, 1000, 'swing');
target.animate({left:'-118'}, 1);
target.animate({left: '+=0'}, {duration:3000, complete:setMove});
}
setTimeout(setMove, 1000);

回答No.2

fujillin

A No1です。

＞一度目はspeedが1000で、2度目以降に3000にするために、
＞変数の上書きが必要だと思うのですが、
変数を上書きすれば変数の値は変わりますが、setInterval()でのインターバルはその文が実行された時の値で設定されます。
関数を実行する度に変数値が参照されるわけではありませんので、上書きしてもご主旨にそった結果にはならないと思います。
一方で、setIntervalの間隔は最初に関数が実行されるまでのタイムラグにもなりますので、即座に実行してから一定時間ごとに繰り返したいときなどに同様の処理が必要になると思います。

実現する方法はいろいろあると思いますが、
◇1回目をsetTimeoutで呼び出して、2回目以降をsetIntervalで実行する。
（delayを無くすと、上記の「一度実行してから繰返し」になります）
var target = $('#test');
var t;
animate(1000, 3000, setMove);

function animate(delay, interval, func){
　setTimeout(function(){
　　func();
　　t = setInterval(func, interval);
　}, delay);
}

◇jQueryを利用なさっているようですが、コールバックの概念をsetMoveにも付加える
（jQueryのコールバックと別に定義しているので、わかりにくくなりますが）
var target = $('#test');
var t, speed = 1000;
setTimeout(function(){
　speed = 3000;
　setMove(function(){ t = setInterval(setMove, speed); });
}, speed);

function setMove(func){
target.animate({left:600} , 1000 , 'swing' , function(){
　$(this).css('left' , -118);
　if(typeof func === "function") func();
});
}

などなど…

上の例は、自分ながら、あまり整理されたものになっていないですね。
もっと良い書き方がありそうな気がしますが、取りあえずで申し訳ありません。

回答No.1

fujillin

ご質問の主旨がよくわかりかねますが…

ご提示のコードが全体を示していると仮定してよいのなら、変数speedのスコープはすでに関数の外になっています。（当然、関数内でも使用できますが）

＞setMove()の中のspeedを関数の外に出したいのですが、
の意味が、　speed=3000;　という文を関数の外に出したいという意味であるなら、ほぼ同じ処理としてmain側で
　var target = $('ul#mainNavi li').find('.light');
　var speed = 1000;
　var t = setInterval(setMove() , speed);
　speed = 3000;
として、関数内の1行を削除しても、同様の処理となるでしょう。

コードが違うので、ちゃんと比較すれば異なりますが、ご提示のコードが全てだとすれば、実行の順序は保たれていますので（タイミングや再定義の回数等は違いますが処理の流れに影響がないので）同等ということができると思います。

ご質問の意味を取り違えていましたら、無視してください。

補足

一度目はspeedが1000で、2度目以降に3000にするために、変数の上書きが必要だと思うのですが、どのようにやればいいかわからない状態です。