我目前正在完成一个简单的随机报价机，你可以看到下面的代码。我在将twitter的分享按钮集成到我的代码中时遇到了问题。出于某种原因，我无法从我出现的引用中获取文本值，并将其动态加载到附加引号文本的新窗口中。我做了很多研究，但没有找到任何澄清。我正在使用一些Jquery。如果有人可以帮助我，我会非常感激。
主档案：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<title>Quote Machine</title>
<!-- Bootstrap -->
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" integrity="sha256-7s5uDGW3AHqw6xtJmNNtr+OBRJUlgkNJEo78P4b0yRw= sha512-nNo+yCHEyn0smMxSswnf/OnX6/KwJuZTlNZBjauKhTK0c+zT+q5JOCx0UFhXQ6rJR9jg6Es8gPuD2uZcYDLqSw==" crossorigin="anonymous">
<!-- Google Font -->
<!-- Font Awesome -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<!-- Custom CSS -->
<link rel="stylesheet" href="css/main.css">
</head>
<body>
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#mainnav" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<!-- the nav links, forms, and other content for toggling -->
<div class="navbar-collapse collapse" id="mainnav">
<ul class="nav navbar-nav">
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>
</div>
</nav> <!-- /end Navbar -->
<div class="container">
<div class="row">
<div class="col-md-6 col-offset-3 mainDiv">
<div class="well">
<h1> Random Inspirational Quotes </h1>
</div>
<div class="quoteDiv" id="quoteBox"></div>
<div clas="authorDiv" id="authorBox"></div>
<button class="btn btn-primary quoteButton" id="quoteButton">New Quote!</button>
<br />
</div>
<div class="col-md-6 col-offset-3 tweetButton">
<a href="https://twitter.com/share" class="twitter-share-button" data-count="horizontal" data-text="quotes.quote">Tweet</a>
</div>
</div>
</div>
<script>
// Twitter Javascript -
window.twttr = (function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0],
t = window.twttr || {};
if (d.getElementById(id)) return t;
js = d.createElement(s);
js.id = id;
js.src = "https://platform.twitter.com/widgets.js";
fjs.parentNode.insertBefore(js, fjs);
t._e = [];
t.ready = function(f) {
t._e.push(f);
};
return t;
}(document, "script", "twitter-wjs"));
</script>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha256-KXn5puMvxCw+dAYznun+drMdG1IFl3agK0p/pqT9KAo= sha512-2e8qq0ETcfWRI4HJBzQiA3UoyFk6tbNyG+qSaIBZLyW9Xf3sWZHN/lxe9fTh1U45DpPf07yj94KsUHHWe4Yk1A==" crossorigin="anonymous"></script>
<!-- Quotes -->
<script src="js/quotes.js"></script>
<!-- Main Logic -->
<script src="js/app.js"></script>
</body>
</html>
CSS：
@import url(https://fonts.googleapis.com/css?family=Fjalla+One);
@import url(https://fonts.googleapis.com/css?family=Raleway);
body {
padding-top: 80px;
font-family: "Fjalla One", serif; }
body h1 {
text-align: center;
padding: 5px; }
body .quoteButton {
text-align: center; }
body .mainDiv {
text-align: center; }
body .authorDiv {
padding-top: 10px;
font-style: italic;
border: 1px solid red; }
body .quoteDiv {
font-family: "Raleway", sans-serif; }
body .tweet {
padding-top: 10px; }
body .navbar .navbar-nav {
display: inline-block;
float: none;
vertical-align: top; }
body .navbar .navbar-collapse {
text-align: center; }
body .tweetButton {
padding-top: 5px;
text-align: center; }
Quotes.js（我在哪里存储我的报价）
var quotes = [
{author: "Bill Gates", quote: '"Success is a lousy teacher. It seduces smart people into thinking they can’t lose."'},
{author: "Larry Page", quote:'"If you’re changing the world, you’re working on important things. You’re excited to get up in the morning."'},
{author: "Warren Buffet", quote:'"It’s better to hang out with people better than you. Pick out associates whose behavior is better than yours, and you’ll drift in that direction. "'},
{author: "Phil Knight", quote:'"There is an immutable conflict at work in life and in business, a constant battle between peace and chaos. Neither can be mastered, but both can be influenced. How you go about that is the key to success."'},
{author: "Carl Ichan", quote: '"I enjoy the hunt much more than the “good life” after the victory."'},
{author: "Jeff Bezos", quote: '"I think frugality drives innovation, just like other constraints do. One of the only ways to get out of a tight box is to invent your way out."'},
{author: "Mark Zuckerberg", quote: '"The biggest risk is not taking any risk…. In a world that’s changing really quickly, the only strategy that is guaranteed to fail is not taking risks. "'},
{author: "Steve Ballmer", quote: '"Great companies, in the way they work, start with great leaders."'},
{author: "Larry Ellison", quote: '"I have had all of the disadvantages required for success."'},
{author: "Guy Kawasaki", quote: '"Ideas are easy. Implementation is hard."'},
{author: "Henry Ford", quote: '"When everything seems to be going against you, remember that the airplane takes off against the wind, not with it."'}
];
App.js：
$(document).ready(function() {
console.log('ready!');
$('#quoteButton').click(function randomQuote() {
newQuote = quotes[ranNum()]
$('#quoteBox').hide().text(newQuote.quote).fadeIn('slow');
$('#authorBox').text(newQuote.author);
twttr.widgets.createShareButton(' ', document.getElementbyID('quoteBox'), {text: newQuote});
});
function ranNum() {
return Math.floor(Math.random() * quotes.length);
}
function generateTweet(text) {
var tweetbutton = document.createElement('a');
tweetButton.setAttribute('href', 'https://twitter.com/share');
tweetButton.setAttribute('class', 'twitter-share-button');
tweetButton.setAttribute('data-count', 'horizontal');
tweetButton.setAttribute('data-text', text);
return tweetButton;
}
});
答案 0 :(得分：0)
在这一行中你有一个错字。该函数为getElementById（请注意小写＆＃39; d＆＃39;）。
twttr.widgets.createShareButton(' ', document.getElementbyID('quoteBox'), {text: newQuote});
即便如此，在将其更改为小写后，我仍然得到Uncaught TypeError: document.getElementbyId is not a function。一旦我删除了这段代码并重写了它，错误就消失了，所以我怀疑一个或多个字符存在格式问题。
此外，要在框中显示文字，您需要访问newQuote对象的属性，即{text: newQuote.quote}。