0

選択したフォームのIDがdivのIDと一致したときに非表示のDIVを表示するjQueryスクリプトをASPサイトで実行しています。

$(document).ready(function(){
    $('select[name$="_77"]').change(function() {
        $(".select_77").hide();
        $(".select_77[id='" + this.value + "']").show();
    })
})

この例では、フォームが1つのオプションのみに切り捨てられています。

<select name="option____jdfhj387___77">
    <option value="1922">Raisins</option>
</select>

そして、これは隠されていない多くのdivの1つです:

<div id="select_image">
    <div class="select_77" id="1922" style="display:none;">
        <div class="border">
            <div class="content">
                <img src="photos/option/1922.jpg">
            </div>
        </div>
    </div>
</div>

写真は中サイズで、200枚以上の画像がある場合、ページが読み込まれるまでに約20〜30秒かかります。スクリプト内のすべての画像URLを手動で入力しなくても、親divが表示されたときにのみ画像を読み込む方法はありますか?

4

1 に答える 1

0

OK数時間の調査の結果、私はそれを理解しました。

フォームで選択したIDと一致するimgタグの属性の名前を変更するコードを見つけて追加しました。

$(document).ready(function(){
    $('select[name$="_77"]').change(function() {
        $(".select_77").hide();
        $(".select_77[id='" + this.value + "']").show();
        $("img.option[realsrc][id='" + this.value + "']").each(function() {
            var $t = $(this);
                $t
                .attr({
                    src : $t.attr('realsrc') /* Copies realsrc attribute and makes a src attribute*/
                })
                .removeAttr('realsrc'); /* Deletes the realsrc attribute */
    });
    })
})

次に、class="option"とid="#"を追加し、src=の名前をrealsrc=に変更しました。

<img class="option" id="1922" realsrc="photos/option/1922.jpg">

これで、誰かが画像のIDに一致するオプションを選択すると、画像のrealsrcの名前がsrcに変更され、ダウンロードされて表示されます。

于 2012-07-19T03:48:47.850 に答える