Question

我正在使用jQuery并使用JSON在Codepen.io中创建一个简单的项目我想从对象数组中选择一个随机索引，为此我使用的是getRandomArbritrary函数。
但是，在codepen.io中我有错误“意外的数字”。我的原始代码：

  $(document).ready (function(){
  function getRandomArbitrary(0,2){
  var x = Math.random() * (2 - 0) + 0;
  }

现在这是我更正后的代码：

$(document).ready (function(){
function getRandomArbitrary(low,high){
var low = 0;
var high = 2;
var x = Math.random() * (high - low) + low;
return x;
}

function getQuote(){

var obj1 = [ {author: "-Jeremiah 29:11", quote: "For I know the plans I   have for you,” declares the LORD, “plans to prosper you and not to harm   you, plans to give you hope  and a future."},

{ quote: "If God called us to a task, He will then qualify us for the   job."},

{author:"-1Timothy 6:12", quote: "“Fight the good fight of the faith.   Take hold of the eternal life to which you were called and about which you   made the good confession in the presence of many witnesses."},
        ];

$(".quote").text(obj1[x].quote);
$(".author").text(obj1[x].author);
}


$(".button").on("click", function(){
  getQuote();
});
});

Answer 1

不使用数字，而是为函数参数指定名称：

function getRandomArbitrary(low, high){
    var x = Math.random() * (high - low) + low;
}

最有可能的是，你也希望return结果 - 现在，该功能实际上什么都不做。

Answer 2

Codepen有没有 *错误，问题是你使用实际数字作为函数参数，IE：你是字面上在函数括号中键入数字。

另一个问题是你不在你的函数中返回任何，所以它实际上是无用的。如果您希望函数返回值，则应使用return语句。

现在回到第一个问题，你不应该字面在函数括号中键入值，而你不能提供函数参数这样，如果你想在每次调用函数时提供相同的参数，那么你应该使用它：

function getRandomArbitrary() {
  // determine "low" and "high" values (once)
  var low = 0,
    high = 2;
  // calculate the result
  var x = Math.random() * (high - low) + 0;
  // return the result.
  return x;
}

如果您想在每次调用该函数时提供自己的值，那么您应该使用它：

function getRandomArbitrary(low, high) {
  // calculate the result
  var x = Math.random() * (high - low) + 0;
  // return the result.
  return x;
}

现在，当我说：There is nothing* wrong with Codepen时。请记住，我们永远无法100％确定这一点，如果您认为Codepen有问题，那么您应该真的在support页面上向Codepen报告您认为有问题的内容

我还想提醒您，代码中的jQuery数量最小。您可能想要检查此JS tutorial，只需要30分钟的时间，它让我开始使用JavaScript，我甚至不时地引用它，请确保您知道至少基础知识的JavaScript 之前你学习jQuery 在我理解 jQuery是一个用JavaScript编写的库之前，我（和其他成千上万的开发人员一样）犯了这个错误。

如果你想要动手方法，你可以学习JavaScript＆amp; jQuery并在Code Academy上免费在线进行实践：

我已经修复了HTML中的一些小错误，但总体上没有任何错误“麻烦”。
这是编辑过的HTML：

<html lang="en">
<head>
  <meta charset="utf-8" />
  <meta content="IE=edge" http-equiv="X-UA-Compatible" />
  <meta content="width=device-width, initial-scale=1" name="viewport" />
  <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
  <title>Quote Generator =)</title>
  <!-- Bootstrap -->
  <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" />
  <link rel="stylesheet" type="text/css" href="style.css" />
  <link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Amatic+SC" />
  <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
  <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
  <![endif]-->
</head>
<body>
  <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
  <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
  <div class="container">
    <header class="header"><b>Random Quote Generator</b></header>
    <div class="box">
      <input type="button" value="click me for quote" class="button" />
      <div class="quotes">
        <span class="quote"><h1></h1></span>
        <span class="author"><h1></h1></span>
        <div id="share-buttons">
          <a href="http://www.linkedin.com/shareArticle?mini=true&amp;url=http://codepen.io/ionakathryn/pen/YWEPkz";text=Random Quote Generator: www.ionakathryn.com&amp; target="_blank">
            <img src="https://simplesharebuttons.com/images/somacro/linkedin.png" alt="LinkedIn" />
          </a>
          <a href="https://twitter.com/share?url=https://twitter.com&amp;text=Random Quote Generator: www.ionakathryn.com&amp;hashtags=FreeCodeCamp" target="_blank">
            <img src="https://simplesharebuttons.com/images/somacro/twitter.png" alt="Twitter" />
          </a>
          <a href="http://www.facebook.com/sharer.php?u=https://codepen.io/ionakathryn/pen/YWEPkz";text= ".quotes"&amp; target=".quotes">
            <img src="https://simplesharebuttons.com/images/somacro/facebook.png" alt="Facebook" />
          </a>
        </div>
      </div>
    </div>
  </div>
  <!-- Include all compiled plugins (below), or include individual files as needed -->
  <script type="text/javascript" src="js/bootstrap.min.js"></script>
</body>
</html>

以下是经过编辑的JavaScript：

// I've noticed that you might use multiple plugins and / or libraries
// so I've written "jQuery(document).ready(function($) {" so that the "$" variable is definitely assigned to jQuery inside the "document ready"
jQuery(document).ready(function($) {
  // removed the quotes list from the function
  // you can even place it above the "document ready" function
  // or even make the quotes variable a global using "window.quotes =" instead of "var quotes ="
  var quotes = [{
    // changed the "quote" to "text" to make it look a little less confusing inside the click function
    "author": "- Jeremiah 29:11",
    "text": "'For I know the plans I have for you,” declares the LORD, “plans to prosper you and not to harm you, plans to give you hope  and a future.'"
  }, {
    "author": "- anonymous",
    "text": "'If God called us to a task, He will then qualify us for the job.'"
  }, {
    "author": "- 1Timothy 6:12",
    "text": "'Fight the good fight of the faith. Take hold of the eternal life to which you were called and about which you made the good confession in the presence of many witnesses.'"
  }, {
    "author": "- Luke 6:31",
    "text": "'Do to others as you would have them do to you.'"
  }, {
    "author": "- 1 Corinthians 13:13",
    "text": "'And now these three remain: faith, hope and love. But the greatest of these is love.'"
  }, {
    "author": "- 1 John 4:8",
    "text": "'Whoever does not love does not know God, because God is love.'"
  }, {
    "author": "- Romans 15:13",
    "text": "'Now may the God of hope fill you with all joy and peace in believing, that you may abound in hope by the power of the Holy Spirit.'"
  }, {
    "author": "- Ecclesiastes 9:10",
    "text": "'Whatever your hand finds to do, do it with all your might.'"
  }, {
    "author": "- Proverbs 12:25",
    "text": "'Anxiety in a man’s heart weighs it down, but an encouraging word makes it glad.'",
  }, {
    "author": "- Mark 9:23",
    "text": "'If you can believe, all things are possible to him who believes.'",
  }];

  // removed the external "getQuote" function as it wasn't unnecessary
  // I'm assuming this because you only use it once
  $(".button").on("click", function() {
    // simplified the process of updating the quote
    var q = quotes[Math.floor(Math.random() * quotes.length)];
    $(".quote").text(q.text).next().text(q.author);
  });
});

祝你好运，一切顺利。

Codepen.io，意外的数字错误

2 个答案: