Question

我需要通过按键增加数组的大小。我可以显示数组的第一个元素，但按另一个键时无法显示数组的其他元素。

我已经使用警报来通过按键来显示消息，并且可以再次显示该键来显示数组中的第一个元素，但是无法显示该数组中的其他元素。 / p>

function display_phrase() {
  var arrayPhrase = ['Relax!', 'Dont Do It!', 'Chill!', 'Take It Easy!', 'Do It!', 'Panic!', 'Beat It!','Forget About It!','Wooooo!','Oh Bother!'];   
  var arrayCounter = 0;
  var arrayPosition = (arrayCounter % arrayPhrase.length);

  $("#display_phrase").html("<h1>" +arrayPhrase[arrayPosition] +".</h1>");
}

var arrayCounter = 0;

$(document).ready(function() {
  $('body').keypress(function() {
    display_phrase();
    arrayCounter++;
  });
});

Answer 1

在您的版本中，display_phrase用相同名称的局部变量屏蔽全局arrayCounter。要对其进行修复，请删除本地var arrayCounter = ...并将声明保留在较高的范围内。

例如：

var arrayPhrase = ['Relax!', 'Dont Do It!', 'Chill!', 'Take It Easy!', 'Do It!', 'Panic!', 'Beat It!','Forget About It!','Wooooo!','Oh Bother!'];   
var arrayCounter = 0;

function display_phrase() {
    var arrayPosition = (arrayCounter % arrayPhrase.length);

    $("#display_phrase").html("<h1>" +arrayPhrase[arrayPosition] +".</h1>");
}

...

Answer 2

删除函数内的arrayCounter。由于您有一个具有相同名称的全局变量和局部变量，因此该局部变量在函数内部具有优先级。

只需删除它，然后让它使用全局变量即可。

function display_phrase() {
  var arrayPhrase = ['Relax!', 'Dont Do It!', 'Chill!', 'Take It Easy!', 'Do It!', 'Panic!', 'Beat It!', 'Forget About It!', 'Wooooo!', 'Oh Bother!'];
  //var arrayCounter = 0;
  var arrayPosition = (arrayCounter % arrayPhrase.length);

  $("#display_phrase").html("<h1>" + arrayPhrase[arrayPosition] + ".</h1>");
}

var arrayCounter = 0;

$(document).ready(function() {
  $('body').keypress(function() {
    display_phrase();
    arrayCounter++;
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="display_phrase"></div>

如何通过按键使数组递增

2 个答案: