jQuery 随机 block 引用

Question

在过去的 2 个小时里，我一直在寻找并测试该问题的各种解决方案，但收效甚微，因此我只好寻求帮助。

我想构建一个引用数组，每个引用都有引用和一个链接，可以随机提取。除了在页面刷新时更改它们之外，我不需要任何其他东西。

但是，我有一些非常美味的 CSS 来设置 block 引用和引用的样式。

下面是一些示例 HTML，用于说明数组中的内容如何适合引号:

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

此代码的预期位置是 Big Cartel 产品(模板)页面，其中包含为每个产品自动生成的内容。因此，如果没有一些随机 JS，每个产品页面上都会出现相同的引用。

Answer 1

根据您的优势，您可以“快速而肮脏”地完成它，也可以将其作为适当的解决方案。

正确的解决方案是让服务器端有一些代码从数据库中提取随机行，并按上面的方式呈现它。由于您的标签与此无关，因此我将跳至

快速但肮脏的解决方案，即有一个引用和链接的 JavaScript 数组，并随机显示一个:

$(document).ready(function() {
  var questions = [
      {q: 'This is question 1', l: 'http://this.is.link1', a: 'Test' },
      {q: 'This is question 2', l: 'http://this.is.link2' , a:'Another'}
  ];

  var i = Math.floor((Math.random()*questions.length));

  $('blockquote p').html(questions[i].q);
  $('blockquote a').attr('href', questions[i].l);
  $('blockquote a').html(questions[i].a);
});

您可以在 jsFiddle 中看到该内容。它假设只存在一个 block 引用，但它可以很容易地扩展。您可以在 HTML 中输出单引号，以便在禁用 JS 时看起来正常。