3

私は同じ画像を読み込もうとしていますが、約束の助けを借りて、最初に1.png、次に2.png、次に3.pngを1つずつ異なる解像度で読み込もうとしていますが、コードを実行すると3.pngのみが読み込まれます画像、私は何を間違っていますか？ 

function loadi(srce){
        if(srce!='3.png'){
        $img1.attr('src',srce).on('load',function(){

            return loadImag();
        });
        }
        else{
            $img1.attr('src',srce).on('load',function(){
                console.log("Load successful");
            });
        }
    }
    function loadImag(){
        return new Promise(function(fulfill,reject){
            fulfill();
        }); 
    }
    loadImag()
            .then(loadi('1.png'),null)
            .then(loadi('2.png'),null)
            .then(loadi('3.png'),null);

最初の提案の後の新しいコード、まだ同じ問題に直面しており、クロム開発ツールで見られるようにロードされる画像は1つだけです

function loadi(srce){

            return loadImage(srce);

    }

    function loadImage(src) {
        return new Promise(function(resolve, reject) {
            $img1.attr('src',src).on('load',function(error){

                     resolve(); 
            });
// Run image loading logic here
// Call resolve() when loading complete, or reject() when fails.
        });
    }

    loadImage('1.png')
            .then(loadi('2.png'))
            .then(loadi('3.png'))
            .then(function() { 
                console.log('Load successful!'); 
            }) // Not in loadImage().
            .catch(function(err) { 
                        console.log("Error");/* Handle potential errors */
});
4

1 に答える 1

3

あなたのコードにいくつか問題があります:

  • loadiPromise を返しません。コールバックからの復帰が期待どおりに機能しません。
  • loadImagで基本的に交換できますPromise.resolve()。
  • .then()関数を期待している場合、関数の結果を渡しています。

コードは次のようになります。

function loadImage(src) {
  return new Promise(function(resolve, reject) {
    // Run image loading logic here
    // Call resolve() when loading complete, or reject() when fails.
  )};
}

loadImage('1.png')
  .then(function() { return loadImage('2.png'); })
  .then(function() { return loadImage('3.png'); })
  .then(function() { console.log('Load successful!'); }) // Not in loadImage().
  .catch(function(err) { /* Handle potential errors */ });
于 2016-01-04T09:16:02.973 に答える