3

クリック イベント ハンドラーを使用して関数を実行する際に問題が発生しています。関数 numberCheck() を取り除き、コードをイベント ハンドラーに直接ポストすると、問題なく動作します。ここで基本的なものが欠けていますか？

これが私のコードです：

jQuery(document).ready(function(){ 
var scopedVariable;
var number = Math.floor(Math.random()*11);
function numberCheck() {
$(this).closest('#outsideContainer').find('.hotter').addClass('hideStuff');
 $(this).closest('#outsideContainer').find('.colder').addClass('hideStuff');
var guess = $(this).closest('#guessContainer').find('.value').val();
    if( +guess === number)
    {
    $(this).closest('#outsideContainer').find('.gotIt').removeClass('hideStuff');
    }
    else {
        $(this).closest('#guessContainer').find('.value').val('Please guess again');
        if(Math.abs(guess - number) < Math.abs(scopedVariable - number)) {
            $(this).closest('#outsideContainer').find('.hotter').removeClass('hideStuff');
            }
        else if(Math.abs(guess - number) > Math.abs(scopedVariable - number)) {
            $(this).closest('#outsideContainer').find('.colder').removeClass('hideStuff');
            }
        scopedVariable = guess;
        } 


}

$('.query').on('click', function() {

        numberCheck();
  }); 
 });

必要に応じて、ここに私の HTML があります。

<body>
    <div id="outsideContainer">
    <div id="guessContainer">
        <h3> Guess a number between 1 and 10 </h3>

        <input id="txtfield" name="txtfield" type="text" class="value"/><br>
        <input type = "submit" class="query" />

    </div>
    <div id="guessShow">
        <p class="hotter hideStuff" > Getting Hotter!! </p>
        <p class="colder hideStuff"> Getting Colder, BRRR!!! </p>
        <p class="gotIt hideStuff"> Awesome! You have guessed the number </p>
    </div>
    </div>
    </body>

これに対する助けは大歓迎です。

4

4 に答える 4

0

コードを次のように変更します

jQuery(document).ready(function(){
   var that = this;
   // the rest of your code

内部関数のthat代わりに使用します。this

于 2013-06-07T14:58:11.610 に答える