Codepen.io，意外号码错误

Question

I am using jQuery and making a simple project in Codepen.io using JSON. 我正在使用jQuery，并使用JSON在Codepen.io中创建了一个简单项目。
I want to select a random index from the object array and to do this I am using getRandomArbritrary function. 我想从对象数组中选择一个随机索引，为此，我正在使用getRandomArbritrary函数。
However, in codepen.io I am having the error "unexpected number". 但是，在codepen.io中，我出现错误“意外号码”。 My original code: 我的原始代码：

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

Now this is my code after correction: 现在这是我的修改后的代码：

$(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

Instead of using numbers, give names to the function parameters: 不要使用数字，而是给函数参数命名：

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

Most likely, you also want to return the result -- right now, the function effectively does nothing at all. 最有可能的是，您还想return结果-现在，该函数实际上什么也没做。

Answer 2

There is nothing * wrong with Codepen , the problem is that you are using actual numbers as the function arguments, IE: you are literally typing numbers into the function parenthesis. Codepen 没有错，问题是您使用实际数字作为函数参数IE： 实际上是在函数括号中键入数字。

Another problem was that you were not returning anything in your function, so it was practically useless . 另一个问题是您没有在函数中返回任何内容 ，因此它实际上是无用的 。 If you would like to have a function return a value you should use the return statement. 如果您想让一个函数返回一个值，则应该使用return语句。

Now back to the first problem, you are not supposed to literally type values into the function parenthesis and you cannot supply function arguments in this manner, if you would like to provide the same arguments every time the function is called then you should use this: 回到第一个问题，您不应该在函数括号中直接键入值，并且不能以这种方式提供函数参数，如果您希望每次调用函数时都提供相同的参数，则应该使用以下方法：

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;
}

If you would like to to supply your own values every time you call the function, then you should use this instead: 如果您希望在每次调用该函数时都提供自己的值，那么应该改用以下方法：

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

Now, when I said: There is nothing* wrong with Codepen . 现在，当我说： There is nothing* wrong with Codepen 。 Please remember that we can never be 100% sure of this, and if you think there is something wrong with Codepen then you should really report what you think is problem to Codepen on their support page. 请记住，我们不能确定这100％，如果你觉得有什么不妥Codepen那么你真的应该报什么你认为是问题Codepen他们的支持页面。

I would also like to remind you that the amount of jQuery in your code is minimal at best . 我还想提醒您，代码中jQuery的数量最多是最少的 。 You might want to check this JS tutorial out, it takes only 30 minutes of your time and it got me started with JavaScript and I even reference it every now and then, please make sure you know at least the basics of JavaScript before you learn jQuery. 您可能需要检查一下此JS教程，只花了30分钟的时间，它使我开始使用JavaScript，甚至不时地引用它，请确保在学习jQuery 之前 至少了解 JavaScript 的基础知识 。
I (like thousands of other developers) made this mistake before I understood that jQuery is a library written in JavaScript . 在了解jQuery是一个用JavaScript编写的库之前，我（与成千上万的其他开发人员一样）犯了这个错误。

If you would like a hands on approach, you can learn JavaScript & jQuery and practice them online for free over on Code Academy : 如果您希望动手实践，可以通过Code Academy 免费学习JavaScript和jQuery并在线进行实践：

I've fixed some minor mistakes in your HTML, but overall nothing too "troublesome" . 我已经修复了您的HTML中的一些小错误，但总体来说并没有太“麻烦” 。
Here is the edited 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>

Here is the edited JavaScript: 这是经过编辑的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);
  });
});

Good luck and all the best. 祝你好运，一切顺利。

Codepen.io，意外号码错误

问题描述

2 个解决方案

解决方案1
1 2016-07-12 22:21:53

解决方案2
1

Codepen.io，意外号码错误

问题描述

2 个解决方案

解决方案1 1 2016-07-12 22:21:53

解决方案2 1

解决方案1
1 2016-07-12 22:21:53

解决方案2
1