JavaScript - Onclick 函数

标签 javascript html

我正在尝试在单击按钮时调用该函数。功能本身工作正常(我可以记录它),但我无法在单击按钮时在浏览器中显示它。我是第一次这样做,对于有经验的 JS 程序员来说,这个问题应该很明显。

谢谢!

<!DOCTYPE html>
<html lang="en">
<link rel="stylesheet" href="style.css">
<head>
    <meta charset="UTF-8">
 <title>X</title>
</head>
<body>
    <div id="pickButton">
        <input class="button" type="button" value="CLICK HERE TO PICK NOW!" onclick="giveNumbers()">
    </div>

    <div class="mainNumberSpanAndTitle">
        <label>MAIN NUMBERS: </label>
            <span id="mainNumberSpan"></span>
    </div>
<script>

 function giveNumbers() {

   var digits = []
   for (var i = 0; i < 6; i++) {
       var digit = getRandomNumber1to50()  
       digits.push(digit)
   }
   digits.push(getRanomNumber1to7())
   digits.push(getRanomNumber1to7())
   return digits


 }

function getRandomNumber1to50() {
  var num;
  num = Math.random()*50+1;
  num = Math.floor(num);  
  return num
}

function getRanomNumber1to7() {
  var num;
  num = Math.random()*7+1;
  num = Math.floor(num);  
  return num
}
    var mainNumberSpan = document.getElementById('mainNumberSpan');

    mainNumberSpan.innerHTML = digits;
}
</script>
</body>
</html>

最佳答案

试试这个
您在 giveNumbers 函数之外使用了 innerHTML,因此您可以在 giveNumbers 函数中更改 span 的设置值,并且不需要 return 从这个函数

function giveNumbers() {

  var digits = [];
  for (var i = 0; i < 6; i++) {
    var digit = getRandomNumber1to50();
    digits.push(digit);
  }
  digits.push(getRanomNumber1to7());
  digits.push(getRanomNumber1to7());

  var mainNumberSpan = document.getElementById('mainNumberSpan');
  mainNumberSpan.innerHTML = digits;
}

function getRandomNumber1to50() {
  var num;
  num = Math.random() * 50 + 1;
  num = Math.floor(num);

  return num
}

function getRanomNumber1to7() {
  var num;
  num = Math.random() * 7 + 1;
  num = Math.floor(num);

  return num
}
<div id="pickButton">
  <input class="button" type="button" value="CLICK HERE TO PICK NOW!" onclick="giveNumbers()">
</div>

<div class="mainNumberSpanAndTitle">
  <label>MAIN NUMBERS: </label>
  <span id="mainNumberSpan"></span>
</div>

关于JavaScript - Onclick 函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45277219/

相关文章:

javascript - 在 onclick 事件中传递对象时出错

jQuery串行滚动: Add class to active item

html - 3D css 变换 div 覆盖忽略 z 坐标问题

javascript - jQuery - 动画无法正常工作?

javascript - 如何选择从特定 javascript 类继承的所有自定义元素

javascript - 从回调外部的回调中提取参数

javascript - Browserify+Backbone.js "ApplicationState"共享模块

PHP 更改 $_SESSION ['error' 的文本颜色]

javascript - 如何在点击时定位不同的模态

javascript - Foundation 只响应一定的宽度