0

以下のコードは、さまざまなデータを使用して、作業中のページで10回以上繰り返されています。

HTML：

    <div class="kpaGraph">
        <p>Target: 43%</p>
        <div class="progress">
            <div class="bar"></div>
        </div>
    </div>
    <div class="kpaBottom">
      <div class="strong">
        <p>311</p>
      </div>
      <div class="weak">
        <p>number of teachers trained</p>
      </div>
    </div>

Javascript / jQueryを使用して、このコードのすべてのインスタンスで同じ方法で、（43％）div.strong pの数値に基づいて（311）の数値を変更したいと思います。div.kpaGraph pこれを行うための最もクリーンな方法は何ですか？すべてを選択し$('div.kpaGraph p')てから使用するeach()必要がありますか、それとも関数を作成してすべてで実行する必要がありますか？

ありがとう！

4

3 に答える 3

1

You can use the following to find the proper element in conjuntion with an .each() on $('div.kpaGraph p'):

$(this).parent().next('div.kpaBottom').find('div.strong p')

For example, using the following will take the value in the kpaGraph p node and append it to the p node in the following kpaBottom node:

$('div.kpaGraph p').each(function () {
    $(this).parent().next('div.kpaBottom').find('div.strong p').html('foo');
});

jsFiddle example

于 2013-02-21T17:02:47.897 に答える
0

いくつかの方法があります。

「次へ」を使用できます。

$('.kpaGraph').each(function(){
   var $kpaStrong = $(this).next('.kpaBottom .strong p');//this is the elm that has 311
});

または、共通の親のように、それらが一緒になっていることがわかるように、何らかの方法でそれらの間に関係を作成する必要があります。

<div class="kpaWr">
    <div class="kpaGraph">
        <p>Target: 43%</p>
        <div class="progress">
            <div class="bar"></div>
        </div>
    </div>
    <div class="kpaBottom">
        <div class="strong">
            <p>311</p>
        </div>
        <div class="weak">
            <p>number of teachers trained</p>
        </div>
    </div>
</div>

次に、jQueryを使用して次のように選択できます。

$('.kpaGraph').each(function(){
   var $kpaStrong = $(this).closest('.kpaWr').find('.kpaBottom .strong p');//this is the elm that has 311
});
于 2013-02-21T17:03:37.493 に答える
0

このようなものもかなりきれいかもしれません:

$("div.strong p").text(function(index, text){
    return $(this).closest("div.kpaBottom").prev("div.kpaGraph").find("p").text();
});

これにより、テキストがTarget: 43%例のように変更されます。

于 2013-02-21T17:10:03.273 に答える