0

8 つの項目の順序付けられていないリストがあります。ページの読み込み時に、最初の 5<li>つにはデフォルトのサムネイル画像があり、6 番目のものには ID が$('#last'). ユーザーが新しい画像を挿入すると、「src」が新しい画像に置き換え$('#last')られます。これは最も効率的な方法ではありませんが、機能します。

<ul>
    <li><img src="img1.png" /></li>
    <li><img src="img2.png" /></li>
    <li><img src="img3.png" /></li>
    <li><img src="img4.png" /></li>
    <li><img src="img5.png" /></li>
    <li><img src="1px.png" id="last"/></li>
    <li></li>
    <li></li>
</ul>

ユーザーが新しい画像を追加すると、のID$('#last')が削除されeach()、次の空の<li>画像を見つけて1px x 1pxの画像を挿入し$('#last')、次の画像のアップロードの準備が整うようにします。

この時点で、1px x 1px の画像が含まれているindex()のを取得する必要があります。その ID は です。これにより、セッションにインデックスを保存できるようになり、ユーザーがページに戻ったときにID が設定されたままになります。別の画像を受け入れる準備ができています。<li>$('#last')$('#last')

<li>ページの読み込み後に設定されたので、その画像を含むのインデックスを取得するにはどうすればよいですか? delegate()入手方法や入手方法はありon()ますか？つまり、ページの読み込み後に設定された要素のインデックスを取得するにはどうすればよいですか?

4

3 に答える 3

0

私が理解しているように、<img id = "＃last" ...を挿入して、＃lastを持つliのindex（）を取得できます。

var list = $('#last').parent('li');
alert( $('li').index(list) );

例

于 2012-06-06T22:36:07.033 に答える
0

以下の提案はすべて、これらのスクリプトのスニペットが新しいスクリプトが挿入された後に実行されるという前提に基づいています。li

li最後の要素のインデックスを取得するには:

var lastLi = $('ul li:last').index();

条件付きでこれを行うには、一致するかどうかを確認しますsrc。

var lastLi = $('ul li').filter(
                 function(){
                     return $(this).attr('src') == '1px.png';
                 });

li最後に常にプレースホルダー画像が含まれると仮定すると、次のようになります。

var lastLi = $('#last').index();

参考文献:

于 2012-06-06T22:07:17.443 に答える
0

皮切りに：

<ul>
    <li><img src="img1.png" /></li>
    <li><img src="img2.png" /></li>
    <li><img src="img3.png" /></li>
    <li><img src="img4.png" /></li>
    <li><img src="img5.png" /></li>
</ul>

そして、画像が追加されるたびに:

$('ul').append('<li><img src="imgn.png" /></li>');

「imgn.png」は新しい画像ファイルの名前です。リストに含まれる画像の数を知る必要がある場合は、いつでも次のようにします。

$('ul li').length

ただし、常に 8 つのリスト要素を持つことが重要な場合は、次のようになります。

<ul>
    <li><img src="img1.png" /></li>
    <li><img src="img2.png" /></li>
    <li><img src="img3.png" /></li>
    <li><img src="img4.png" /></li>
    <li><img src="img5.png" /></li>
    <li></li>
    <li></li>
    <li></li>
</ul>

function addImage(url){
    $('ul li:empty').first().html('<img src="' + url + '" />');
}
addImage('img6.png');
于 2012-06-06T22:19:52.847 に答える