jQuery中給定div中的每個元素與類

我有一個小問題。我試圖建立這個簡單的測驗。現在它看起來是這樣的：jQuery中給定div中的每個元素與類

<?xml version="1.0" encoding="utf-8"?> 
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl"> 
    <head> 
     <meta charset="utf-8" /> 
     <link rel="stylesheet" href="style/style.css" /> 
     <script src="js/jquery-1.9.1.min.js"></script> 
     <title></title> 
    </head> 
    <body> 
     <div class="pytanie"> 
     <p class="tresc">1. Ile księżyców ma ziemia?</p> 
     <p class="odpowiedz">A) 1</p> 
     <p class="odpowiedz">A) 2</p> 
     <span class="btn-sprawdz" id="btn-sprawdz-1">Sprawdź</span> 
     </div> 
     <div class="pytanie"> 
     <p class="tresc">1. Ile księżyców ma ziemia?</p> 
     <p class="odpowiedz">A) 1</p> 
     <p class="odpowiedz">A) 2</p> 
     <span class="btn-sprawdz" id="btn-sprawdz-1">Sprawdź</span> 
     </div> 
     <script> 
     $(document).ready(function() { 
      var score; 
      score=0; 
      // Mechanizm zaznaczania odpowiedzi 
      $('.odpowiedz').click(function() { 
       // Najpierw odznacz zaznaczone odpowiedzi 
       $('div.pytanie p').each(function(){ 
        $(this).css('background-color','white'); 
       }); 
       // Zaznacz tę odpowiedź 
       $(this).css('background-color','blue'); 
       }); 
       //Mechanizm sprawdzania 
       $('#btn-sprawdz-1').click(function() { 
      }); 
     }); 
     </script> 
    </body> 
</html>

我的問題是顯而易見的 - 當我點擊任何問題，它改變了所有div.pytanie的所有p元素background-color。我知道我可以使用id選擇器，但它有必要嗎？也許有另一種選擇，將每個循環僅修剪到一個div？

來源

2013-05-20 Glorifind

這不是我exacly需要 - 這種解決方案清除所有的p元素中的所有問題 - 也許你做了一些小的失誤？感謝您的幫助:) – Glorifind

是這樣的？ http://jsfiddle.net/cHktk/2/ –

你有多個ID爲'btn-sprawdz-1'的元素。 – 2013-05-20 12:47:02

嘗試

$(document).ready(function() { 
    var score; 
    score=0; 
    // Mechanizm zaznaczania odpowiedzi 
    $('.odpowiedz').click(function() { 
     // Najpierw odznacz zaznaczone odpowiedzi 
     $(this).closest('.pytanie').find('p.odpowiedz').css('background-color','white'); 
     // Zaznacz tę odpowiedź 
     $(this).css('background-color','blue'); 
    }); 
    //Mechanizm sprawdzania 
    $('#btn-sprawdz-1').click(function() { 

    }); 

});

演示：Fiddle

來源

2013-05-20 12:17:46

它完美的作品 - 非常感謝您的回答和您的時間。 – Glorifind

'+ 1'最好只製作'白色''.odpowiedz'元素;） – 2013-05-20 12:39:52

@NOX你說的對，完成 –

是的，它可能與父（）選擇器。

$('.odpowiedz').click(function() { 
    $(this).parent(); // <div class="pytanie"> 
    $(this).parent().css('background-color','yellow'); 
});

來源

2013-05-20 12:09:36

我的JS部分看起來像：http://jsfiddle.net/aL9Hb/它不工作，我不知道爲什麼？它首先將所有bg顏色設置爲白色，然後將該pbg-color設置爲藍色？我哪裏錯了？ – Glorifind

它的工作，但它設置白色背景，而它已經白色BG已經:) http://jsfiddle.net/aL9Hb/1/ –

這fiddle將設置在當前DIV的點擊.odpowiedz的藍色背景。

$('.odpowiedz').click(function() { 
    // Najpierw odznacz zaznaczone odpowiedzi 
    $(this).parent().find(".odpowiedz").css('background-color', 'white'); 
    // Zaznacz tę odpowiedź 
    $(this).css('background-color', 'blue'); 
});

來源

2013-05-20 12:14:33 Niklas

這也是像一個魅力工作。感謝您的時間和建議。 – Glorifind

Working FIDDLE Demo

你必須得到當前問題的所有.odpowiedz，此去上.pytanie 然後選擇所有.odpowiedz：

$(this) 
    // go up the dom to the current question 
    .closest('.pytanie') 

    // and now find all possible answers 
    .find('.odpowiedz') 

     // and make them white 
     .css('background-color', 'white');

來源

2013-05-20 12:30:03

jQuery中給定div中的每個元素與類

回答

相關問題