0

私はプログラミングにかなり慣れていないので、頭を悩ませている問題があります。私は、画像ギャラリーをホストする Web サイトのメンバーです。ギャラリーのリストを含むページを表示すると、すべてのギャラリーのアイコンの下にタグが表示されます。

<div class="id4">
    <a href="..."><img src="..."></a>
    <div class="id44">
        <div class="tft" title="tag1, tag2"></div>
        <div class="tft" title="tag3"></div>
    </div>
    <div class="tags"></div>
</div>
<div class="id4">
    <a href="..."><img src="..."></a>
    <div class="id44">
        <div class="tft" title="tag1"></div>
        <div class="tft" title="tag2"></div>
    </div>
    <div class="tags"></div>
</div>

各アイコンにカーソルを合わせるのが面倒なので、それらが属するギャラリーの下の「タイトル」属性内にタグを書き込むカスタム スクリプトを作成したいと思いました。これは私が得ることができる限りです：

$(".id44").after('<div class="tags"></div>');
$(".id44").each(function() {
    var array = [];
    $(".tft").each(function() {
        var tags = $(this).attr("title");
        array.push(tags);
    });
    console.log(array);
});

ギャラリーの数だけ、ページ上のすべてのタグの巨大なリストをコンソールに出力するだけです。

4

2 に答える 2

1

.tft現在の要素の子孫である要素を探します。

$(this).find(".tft").each(function() {
    array.push(this.title);
});

$(".tft")単独では、クラスが のすべての要素に一致しますtft。

全体を次のように書きます。

$('.id44').each(function() {
    var tags = $(this).find('.tft').map(function() {
        return this.title;
    }).get();

    $('<div>', {
        'class': 'tags',
        'text': tags.join(', ')
    }).insertAfter(this);
});

.map(...).get()は、すべてのタグの配列を作成するコードを記述する簡単な方法です。

于 2013-06-16T23:19:04.973 に答える
1

問題は、ループして.tftいる電流に限定されないことです。.id44を使用"selector", thisすると、結果がthis-container に制限されます。また、右にタグの付け方を追記しました.tag-div。

$(".id44").after('<div class="tags"></div>');
$(".id44").each(function() {
    var array = [];
    $(".tft", this).each(function() {
        var tags = $(this).attr("title");
        array.push(tags);
    });
    $(".tags", this).html(array.join(','));
});
于 2013-06-16T23:20:22.567 に答える