画像が存在しない場合、別の画像を使用するにはどうすればよいですか?( '#id')。attr(“ src”を使用する

Aug 18 2020

私は自分が作成しなかったコードのバグを修正しようとしているCプログラマーです。テーブルの行をクリックすると、IDが「square」の画像が設定されます。

$('#square').attr("src","image/"+row.id+"_2_1.jpg");

ただし、一部の画像には_3_1.jpgという名前が付けられているため(私の管理下にはありません)、_ 2_画像が存在するかどうかを確認し、存在しない場合は_3_バリアントをロードします。

「onerror」の使用は機能していないようで、IFステートメントを挿入するとテーブル全体のロードが停止します。

これが関数全体です。

$('#table').on('click-row.bs.table', function (e, row, $element) { if(config["homing_tool"] == "1"){ $('#detail').show();
            $('#detail1').hide(); $('#detail2').hide();
            $('.homing').hide(); }else{ $('#detail').show();
            $('#detail1').show(); $('#detail2').show();

            $('#iris').attr("src","image/"+row.id+"_0_1.jpg"); $('#square').attr("src","image/"+row.id+"_2_1.jpg");
    };
    var x;
    for (x in row) {
        if(x == "type"){
            $('#'+x).html(spec[row[x]]["name"]); }else{ $('#'+x).html(row[x]);
        }
    }
});

編集:提案をありがとう!すべてのデータはローカルであるため、私が知る限り、サーバーに接続してHTTPリクエストを使用する必要はありません。明日、他の提案を試してみます。リモートでアクセスする必要のあるPCは、6時間先にあり、その日だけシャットダウンします。

回答

Rik Aug 19 2020 at 14:55

いくつかのデバッグと試行錯誤を通して、必要なものにロードする前にイメージが存在するかどうかを確認するように適応させることができました。

皆さんありがとう!

後世のために、私は使用しました:

function getSquareURL(rowid)
{
    var image = new Image();
    
    image.onload = function()
    {
        $('#square').attr("src","image/"+rowid+"_2_1.jpg"); return true; } image.onerror = function() { $('#square').attr("src","image/"+rowid+"_3_1.jpg");
        return false;
    }

    image.src = "image/"+rowid+"_2_1.jpg";
}