从变量内部调用函数

Question

我试图调用生成的随机数并将条件设置为随机数，但我不知道如何调用它！有人可以帮忙吗？

    // This is the random number generator
    $(document).ready(function() {
        var minNumber = 0;
        var maxNumber = 9;
        var randomValue = function(){
            return Math.floor(Math.random() * maxNumber);
        }
        $("#random-number").html(randomValue().toString());
        // I need to return this value to the "myGuess class and print it on the screen"
        console.log(randomValue().toString());
    });
    // This ends the random number generator


    // If you click a number and it equals the random number
    $(".number").on("click", function(){
        var value = $(this).val();
        if($(".guessesLeftVar").text() === function.randomValue){
            $(".winCount").text($(".winCount").text()+value);
        }
        else if($(".guessesLeftVar").text() != function.randomValue){
            $(".lossCount").text($(".lossCount").text()+value);
        }
    });

Answer 1

您需要将click事件移动到documnet中。然后从click事件中调用randomValue函数。将您的代码更改为以下

$(document).ready(function() {
    var minNumber = 0;
    var maxNumber = 9;
    var randomValue = function(){
        return Math.floor(Math.random() * maxNumber);
    }

    $(".number").on("click", function(){

        var random = randomValue();

        $("#random-number").html(random);

        var value = $(this).val();
        if($(".guessesLeftVar").text() === random){
            $(".winCount").text($(".winCount").text()+value);
        }
        else if($(".guessesLeftVar").text() != random){
            $(".lossCount").text($(".lossCount").text()+value);
        }
    });
});

Answer 2

以下是一种可以以更有条理的方式做所需事情的方法：

＆＃13;

＆＃13;

// This ends the random number generator

// loop over our object displaying each value
function displayValues(obj) {
  $.each(obj, function(key, value) {
    $('#' + key).text(value);
  })
}
// returns random number in the provided range
function getRandomValue(minNumber, maxNumber) {
  return Math.floor(Math.random() * maxNumber);
}

// once the doc loads, do all your event binding
$(document).ready(function() {
 
  // creat object to hold all our vars
  var guesses = {
      remaining: 5,
      wins: 0,
      losses: 0,
      random: getRandomValue(0,9),
    }
    
  // show the initial values
  displayValues(guesses)

  $(".number").on("click", function() {
    var value = $(this).val(); 
    if (Number(value) === guesses.random) {
      guesses.wins++;
      // get a new random number
      guesses.random = getRandomValue(0,9)
    } else {
      guesses.losses++;
      guesses.remaining--;
      if (guesses.remaining == 0) {
        // no guesses left, end game
        $('#numbers').replaceWith("<h1>game over</h1>");
      }
    }
    // show the new values
    displayValues(guesses)
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
wins:
<div id="wins"></div>
<br> losses:
<div id="losses"></div>
<br> remaining guesses:
<div id="remaining"></div>
<br> random number (remove in actual game):
<div id="random"></div>
<br>


<div id="numbers">
<button class="number" value="0">0</button>
<button class="number" value="1">1</button>
<button class="number" value="2">2</button>
<button class="number" value="3">3</button>
<button class="number" value="4">4</button>
<button class="number" value="5">5</button>
<button class="number" value="6">6</button>
<button class="number" value="7">7</button>
<button class="number" value="8">8</button>
<button class="number" value="9">9</button>

</div>

＆＃13;

＆＃13;

＆＃13;