1

img各 のリンクにをラップする必要がありますdiv。私が直面している問題は、同じ画像がそれぞれにラップされていることdivです。imgそれぞれの特定のリンクに特定のものをラップする必要がありますdiv。

私が使用しているコード:

$("div.level_1").each(function() {
    $("a.lightview").wrapInner($("img.euImg"));
});

開始コード:

<div class="level_1 euItem group3 generation_y _2012">
    <img border="0" src="img1.jpg" class="euImg" alt="Run">
    <h4>
        <a href="/sport/sport_2014/media_gallery/images/run.htm" class="lightview" data-lightview-group-options="controls: 'thumbnails'">
            <span>Run</span>
        </a>
    </h4>

    <p>Praesent placerat purus in lobortis egestas. Etiam lectus augue, viverra in ultricies vitae, accumsan eu arcu. Phasellus auctor fringilla sem non imperdiet.</p>
    <span class="clear">&nbsp;</span>
</div>

<div class="level_1 euItem group3 generation_y _2012">
    <img border="0" src="img2.jpg" class="euImg" alt="Run">
    <h4>
        <a href="/sport/sport_2014/media_gallery/images/bike.htm" class="lightview" data-lightview-group-options="controls: 'thumbnails'">
            <span>Run</span>
        </a>
    </h4>

    <p>Praesent placerat purus in lobortis egestas. Etiam lectus augue, viverra in ultricies vitae, accumsan eu arcu. Phasellus auctor fringilla sem non imperdiet.</p>
    <span class="clear">&nbsp;</span>
</div>

必要な結果コード:

<div class="level_1 euItem group3 generation_y _2012">
    <h4>
        <a href="/sport/sport_2014/media_gallery/images/run.htm" class="lightview" data-lightview-group-options="controls: 'thumbnails'">
            <img border="0" src="img1.jpg" class="euImg" alt="Run">
        </a>
    </h4>
    <p>Praesent placerat purus in lobortis egestas. Etiam lectus augue, viverra in ultricies vitae, accumsan eu arcu. Phasellus auctor fringilla sem non imperdiet.</p>
    <span class="clear">&nbsp;</span>
</div>

<div class="level_1 euItem group3 generation_y _2012">
    <h4>
        <a href="/sport/sport_2014/media_gallery/images/bike.htm" class="lightview" data-lightview-group-options="controls: 'thumbnails'">
            <img border="0" src="img2.jpg" class="euImg" alt="Run">
        </a>
    </h4>
    <p>Praesent placerat purus in lobortis egestas. Etiam lectus augue, viverra in ultricies vitae, accumsan eu arcu. Phasellus auctor fringilla sem non imperdiet.</p>
    <span class="clear">&nbsp;</span>
</div>
4

4 に答える 4

0

使用しているセレクターは十分に具体的ではありません。このコードは、ドキュメント内のクラスを持つ最初のa要素を選択し、ドキュメント内の最初のクラスを持つ要素をlightviewラップします。imgeuImg

私が間違っていなければ、あなたがしようとしているのは、これらの操作をそれぞれの div の子に適用することです。代わりにこれを試してください：

var img;
$('div.level_1').each(function() {
    img = $(this).children('img.euImg').detach();
    $(this).find('a.lightview').wrapInner(img);
});

detach()要素を削除してコピーを取得しないようにするために必要です。findおよびchildrenに関するドキュメントを参照してください。

于 2013-09-26T12:53:47.577 に答える
0 
$('div.level_1').each(function () {
    var $div = $(this);
    var $img = $div.find('img.euImg');
    var $span = $div.find('a.lightview span');

    $span.replaceWith($img);
});

すべてを少し圧縮することもできますが、うまくいけば、この方法で何をしているのかが明確になります。すべてをまとめて、1 つのヒットで実行する:

$('div.level_1').each(function () {
    $(this).find('a.lightview').empty().append($(this).find('img.euImg'));
});
于 2013-09-26T12:43:41.803 に答える