2011-07-10 5 views
0

でjQueryのインデックスを使用した作業、私は実際に各機能

まず2つの質問を持って、私はHTMLページのパーセンテージを計算し、それを追加することによって、JavaScriptでそれを返すようにしたいです。これは正常に動作しますが、どこでも同じ値に設定されます。私は「これ」のようなものが必要だと思うが、それを働かせる方法を見つけることはできない。それぞれの関数はliの中にとどまらず、どこにでも置かれます。

別の問題は、何らかの理由でvar getalfavconvert = parseFloat(getalfav.substring(1));が奇妙な値を返すことです。一方、var getalconvert = parseFloat(getal.substring(1));は正常に動作します。私はそれがリンクと関係があると思う。

もう一つの問題は、ここで

$(".thing-shot ul").prepend('<li class="hammer">10%</li>'); 

$('.things li .group').each(function(index) { 

    // get value from page 
    var getal = $('.current-user-view').text(); 
    var getalfav = $('.fav.marked a').text(); 

    // convert value to float 
    var getalconvert = parseFloat(getal.substring(1)); 
    var getalfavconvert = parseFloat(getalfav.substring(1)); 

    //make a percentage calculation 
    var gedeeld = getalconvert/getalfavconvert; 
    var percentage = gedeeld*100; 

    // Set percentage in html 
    $(".hammer").text(percentage);   
}); 

されるHTML中のLiの構造である:

<li id="screenshot-2081" class="group"> 
    <div class="athing"> 
     <div class="thing-shot"> 
      <div class="thing-img"> 
       <a href="go.html" class="link"><img alt="teaser" src="teaser.png?1310142565" /></a> 
      </div> 

      <ul class="tools group"> 
       <li class="fav marked"> 
        <a href="go.html">21</a> 
       </li> 
       <li class="cmnt current-user-cmnt 
        "> 
        <a href="#">6</a> 
       </li> 
       <li class="views current-user-view"> 
        276 
       </li> 
      </ul> 
     </div> 
     <div class="extras"> 

     </div> 
    </div> 
</li> 
+0

:-)例えば見at this JSFiddleを取りますか?彼ら(またはそれ)は何ですか? –

+0

ごめんなさい、私はそれをJavaScriptに追加しました。この行:$( "。shot ul")。prepend( '

  • 0%
  • '); – Max

    +0

    @Max: '.shot ul'は' .things li .group'とどう関係していますか? –

    答えて

    1

    あなたがしているとして、あなたが持っている「どこでも、すべてを変えるか」の問題は、かなり一般的なものです特定のクラスのすべてオブジェクトを選択します。あなたがしたいことは.children()セレクタを使用して 子供をのそれぞれのオブジェクトで見つけることです。を使って、.each()を使用してください。

    私はこれらの変更を反映するためにあなたのjQueryを編集した:

    $(".shot ul").prepend('<li class="hammer">0%</li>'); 
    
    $('.things li .group').each(function(index) 
    { 
        // get value from page 
        var getal = $(this).children('.current-user-view').text(); 
        var getalfav = $(this).children('.fav.marked').find("a").text(); 
    
        // convert value to float 
        var getalconvert = parseFloat(getal.substring(1)); 
        var getalfavconvert = parseFloat(getalfav.substring(1)); 
    
        //make a percentage calculation 
        var gedeeld = getalconvert/getalfavconvert; 
        var percentage = gedeeld*100; 
    
        // Set percentage in html 
        $(this).children(".hammer").text(percentage); 
    }); 
    

    EDIT

    あなたは上記のコードを見れば、あなたは

    var getalfav = $(this).children('.fav.marked').find("a").text();

    が表示されますここの鍵は.find("a")です - 実際の<a>タグは<ul>の子であるが、.children()が好きでない子の子であり、従って.find()である。それを行うための別の方法はこれです:

    var getalfav = $(this).children('.fav.marked').text();

    .text()は内容からすべてのHTMLを取り除き、ちょうど数であなたを残しますので、これはまだ正しい値を与えます。私は.find()メソッドをお勧めしますが、読みやすく、意味的に正しいだけでなく、他の追加されたコンテンツが物事を混乱させるという事実もあります。

    あなたはハンマーのクラスといくつかの要素を持っている

    +0

    素晴らしい!ジョブ! Thanx、今でも少し問題があります:これは何も返しません:var getalfav = $(this).children( 'fav.marked a')。 – Max

    +0

    申し訳ありません私の編集を見てください。 – Bojangles

    関連する問題