jQuery的随机块引用 [英] jQuery random blockquote

问题描述

我花了在过去2小时寻找，并到这个问题，但到收效甚微，所以我辞职，寻求帮助测试各种解决方案。

I've spent the past 2 hours looking for and testing various solutions to this problem but to little success so I'm resigned to asking for help.

我想建立报价它们都有引文和和纽带，随意拉的数组。我不需要任何东西超过了他们在页面刷新更改。

I would like to build an array of quotes which each have citations and and a link, to be pulled at random. I don't need any thing more than for them to change upon page refresh.

不过，我有一些pretty美味的CSS样式块引用和引用。

However, I have some pretty tasty CSS to style blockquote and cite.

下面是一些例子HTML来说明如何从数组中的内容将适合报价内：

Here's some example HTML to illustrate how the content from the array would fit within a quote:

<blockquote>
  <p>A line of oversize watches that can offer many of the attributes of premium luxury watches at an affordable price.
  </p>
  <cite>&mdash; 
    <a href="http://www.horozima.com/2012/07/terranaut-xl-50mm.html" target="_blank">Horozima
    </a>
  </cite>
</blockquote>

这code预期的位置是一个大的卡特尔产品（模板）页面针对每个产品自动生成的内容。所以，如果没有一些随机JS相同的报价是每一个产品页面上。

The intended location for this code is a Big Cartel product (template) page with automatically generated content for each product. So, without some randomizing JS the same quote would be on every product page.

推荐答案

在domready中执行JavaScript使用的 随机（） 函数产生一个随机数。如果通过一个值乘以这个号码，你会得到0之间的值（但不包括该值本身）的随机数。如果你把引号成JSON数组，你可以使用数组的。长度属性值，你因为项目的数组中的数字乘以大于较大的一个最后一个项目的索引。这将生成一个随机数，它是阵列的指标之一。

Execute JavaScript on DOMReady to use the random() function to generate a random number. If you multiply this number by a value you will get a random number between 0 and the value (but not including the value itself). If you put the quotes into a JSON array, you can use the array's .length property for the value you multiply by since the number of items in the array is one larger than the index of the last item. This will generate a random number that is one of the indexes of the array.

在此之后，使用jQuery的 文本（） 函数来代替段落和引用标签的文本，以显示你随机选择的报价。

After this, use jQuery's text() function to replace the text of the paragraph and citation tags to display the quote you randomly selected.

下面是一个例子：
http://jsfiddle.net/sWvGp/

HTML：

HTML:

<blockquote id="randomquote">
    <p></p> <cite>&mdash; <a href="#" target="_blank"></a></cite>
</blockquote>

使用Javascript：

Javascript:

var myQuotes = [{
    quote: "To err is human; to forgive, divine.",
    cite: "Alexander Pope",
    url: "http://www.example.com"
}, {
    quote: "Reports of my death have been greatly exaggerated.",
    cite: "Mark Twain",
    url: "http://www.example.com"
}, {
    quote: "A line of oversize watches that can offer many of the attributes of premium luxury watches at an affordable price.",
    cite: "Horozima",
    url: "http://www.horozima.com/2012/07/terranaut-xl-50mm.html"
}];

var randomQuote = Math.floor(Math.random() * myQuotes.length)

$('p', '#randomquote').text(myQuotes[randomQuote].quote);
$('cite a', '#randomquote').attr('href', myQuotes[randomQuote].url).text(myQuotes[randomQuote].cite);

这篇关于jQuery的随机块引用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！