jQuery addClass() function in if statement

-1

У меня проблемы с jQuery, и я не мог найти ничего, что могло бы мне помочь.jQuery addClass() function in if statement

Так что я пытаюсь изменить цвет класса «курсор» на зеленый, когда количество картофеля больше, чем стоимость курсора. Поэтому я хочу, чтобы текст «Buy Cursor» был зеленым, если картофель больше, чем cursorCost.

Вот HTML код & JQuery:

<html> 

<head> 
    <title>Potato Clicker</title> 
    <link rel="stylesheet" type="text/css" href="interface.css"> 
</head> 

<body> 

    <div id="left"> 
     <img id="potato-img" onClick="potatoClick(clickPower)" src="stockvault-potatoes107220.jpg" width="300" height="300"> 
     <br> 
     <div id="mainDisplay"> 
      <span id="potatoes">0</span> 
      <br>potatoes 
      <br> 
      <br>Producing <span id="pps">0</span> potatoes per second 
      <br> 
      <button onClick="save()">&nbsp; Save &nbsp;</button> 
      <br> 
      <button onClick="reset()">&nbsp; Reset &nbsp;</button> 
     </div> 
    </div> 

    <div id="middle-buy"> 
     <br> 
     <div id="buildings" class="cursor" onClick="buyCursor()">&nbsp; Buy Cursor &nbsp;</div> 
     <br> 
     <br> 
     <div id="buildings" class="farmer" onClick="buyFarmer()">&nbsp; Buy Farmer &nbsp;</div> 
     <br> 
     <br> 
     <div id="buildings" class="breeder" onClick="buyBreeder()">&nbsp; Buy Breeder &nbsp;</div> 
     <br> 
     <br> 
    </div> 

    <div id="middle-cost"> 
     <div style="font-size: 18px">Next building costs:</div> 
     <div id="cost"><span id="cursorCost">10</span> potatoes</div> 
     <br> 
     <div id="cost"><span id="farmerCost">100</span> potatoes</div> 
     <br> 
     <div id="cost"><span id="breederCost">500</span> potatoes</div> 
     <br> 
    </div> 

    <div id="middle-info"> 
     <br> 
     <div id="quantity"><span id="cursors">0</span> cursors clicking away at <span id="cursorPps">0</span> potatoes per second</div> 
     <br> 
     <br> 
     <br> 
     <div id="quantity"><span id="farmers">0</span> farmers farming at <span id="farmerPps">0</span> potatoes per second</div> 
     <br> 
     <br> 
     <br> 
     <div id="quantity"><span id="breeders">0</span> breeders breeding at <span id="breederPps">0</span> potatoes per second</div> 
     <br> 
     <br> 
     <br> 
    </div> 


    <script src="main.js"></script> 
    <script src="jquery.js"></script> 
    <script> 
     $(document).ready(function() { 

      window.setInterval(function() { 

       if (potatoes >= cursorCost) { 

        $(".cursor").addClass("buyable"); 

       }; 

      }, 1000); 

     }); 
    </script> 
</body> 

</html>

Вот CSS:

.cursor.buyable { 

color: green; 

}

Теперь проблема заключается в том, что, хотя я использую правильный селектор, текст под

class="cursor"

не загорается зеленым цветом, если

potatoes > cursorCost

источник

2013-12-23 Tan WS

Проблема заключается в вашем селекторе:

$("cursor")

Если вы хотите, чтобы элемент с cursorid изменить его на:

$("#cursor")

Если вам нужен элемент с cursorclass изменения его до:

$(".cursor")

источник

2013-12-23 13:25:18

Ох. Если это для элемента с классом курсора, то как вы обновляете цвет текста? Как работает document.getElementById для ids, есть что-то еще для классов? –

$ ('. Cursor') - это селектор в jQuery для элементов с классом курсора. Для получения дополнительной информации обратитесь к: http://api.jquery.com/category/selectors/ –

Простите, что я не совсем понял, что я имел в виду, это то, что является версией класса document.getElementById? Это document.getElementByClass? –

jQuery addClass() function in if statement

ответ

Смежные вопросы