0

私はゆっくりと Javascript に慣れてきましたが、今では本当に簡単な質問があります。
私の用語がその場にない場合は、私に尋ねたり、修正したりしてください。

これら 2 つ (またはそれ以上) の動作を同じスクリプト (ファイル) に含めるにはどうすればよいですか。

    $(document).ready(function(){
        var $container = $('div.fillField'),
        divs = $("div.onethird").get().sort(function(){ 
                return Math.round(Math.random())-0.5;
            }).slice(0,3),
            $clonedDivs = $(divs).clone();
        $container.html('');
        $clonedDivs.each(function( index ) {
            $container.append(this);
            if (index % 3 == 0) {
              $(this).css("margin-left", "0%");
            } else {
              $(this).css("margin-left", "2%");
            }
        });

        $clonedDivs.show();

        //break & next command

        var $container = $('div.fillField'),
            divs = $("li.onethirdAll").get().sort(function(){ 
                return Math.round(Math.random())-0.5;
            }),
            $clonedDivs = $(divs).clone();
        $container.html('');
        $clonedDivs.each(function( index ) {
            $container.append(this);
           });
        $clonedDivs.show();
    });

別々にそれらは正常に動作しますが、それらを一緒にすると、最後のものだけが実行されているようです

4

2 に答える 2

2

2 番目のブロックの次のコード行:

var $container = $('div.fillField');
$container.html('');

最初のブロックで行ったことをクリアして、div.fillField再び空にします (コードの最初の部分で追加したものを一掃します)。

動作をどうしたいかは完全には明らかではありませんが、新しいコンテンツをコンテナーに追加したいだけで、2 番目のブロックでそれをクリアしたくない場合があります。

于 2013-10-13T03:49:14.233 に答える
0

個別に何をしているのかを知っていると仮定すると、問題ありません。

$(document).ready(function(){

        var $container = $('div.fillField'),
        divs = $("div.onethird").get().sort(function(){ 
                return Math.round(Math.random())-0.5;
            }).slice(0,3),
            $clonedDivs = $(divs).clone();
        $container.html('');
        $clonedDivs.each(function( index ) {  //this function will be called asynchronously and is using $clonedDivs and $container 
            $container.append(this);
            if (index % 3 == 0) {
              $(this).css("margin-left", "0%");
            } else {
              $(this).css("margin-left", "2%");
            }
        });

        $clonedDivs.show();

        //break & next command

        //use different variables
        var $container2 = $('div.fillField');

        var divs2 = $("li.onethirdAll").get().sort(function(){ 
            return Math.round(Math.random())-0.5;
        });

        var $clonedDivs2 = $(divs2).clone();
        $container2.html('');
        $clonedDivs2.each(function( index ) {
            $container2.append(this);
        });
        $clonedDivs2.show();
    });

javascript でのコンマ演算子と変数宣言についてお読みください。閉鎖についてもお読みください。

2 つの異なるコード スニペットを分離したいだけの場合は、無名関数を使用します。

(function(){
   //first snippet - behaviour if you may
})();

(function(){
   //second
})();
于 2013-10-13T03:56:46.337 に答える