【问题标题】:random html link selector from group of links来自链接组的随机 html 链接选择器
【发布时间】:2017-03-09 12:38:03
【问题描述】:

来自链接组的随机 html 链接选择器。

所以我在我的网站上有这张图片,当点击它会带你到一个 html 页面。很好,唯一的事情是我希望它从一组让我们说五个链接中随机选择一个链接,而不仅仅是 1 个 html 链接。

<a href="url" target="_blank"><img id="img-hover" src="image"/></a>

我需要上面代码的功能仍然可以工作。所以请把你的代码和我的结合起来。对不起英语。另外,这段代码来自一些java,但我认为你不需要它。但在这里。

<script type="text/javascript">

var timer;

document.getElementById('img-hover').addEventListener('mouseover', function() {
clearTimeout(timer);
var elem = this;
timer = setTimeout(function() {
    elem.src='image';
}, 9000);
});

document.getElementById('img-hover').addEventListener('mouseout', function() {
clearTimeout(timer);
var elem = this;
timer = setTimeout(function() {
    elem.src='image?v=513d43d2';
}, 9999999999999999);
});
</script>

【问题讨论】:

  • 这需要使用 JavaScript 来完成。创建一个 URL 数组,点击图片,在 0 和 array.length - 1 之间生成一个随机数,从数组中选择该索引,然后重定向到它。
  • 您是否有一个包含图像源的数组,或者您是否需要算法从服务器中提取文件名?通常,您只需要一个随机数函数,其中包含您可用的最大图像数量以及脚本为该数字分配图像源的方法。
  • 正是 Santi 所说的。我很好奇为什么您将第二次超时设置为9999999999999999...浏览器从 9999999999999999 开始倒计时?您是否希望访问者在该页面上停留那么长时间?
  • 会吗?当你将鼠标悬停在图像上 10 秒时,它会发生变化,我不希望第二张图像消失,所以它为什么这么高......所以如果我什么都不放,它会永远保持下去/
  • @NewToJS 你应该尝试等待它......当它改变时回来

标签: javascript html image hyperlink


【解决方案1】:

您可以使用 url 位置创建一个数组

var locations = [url1, url2, url3, url4, url5];

那你可以说

var url = Math.floor(Math.random() * 5);

这将生成一个介于 0 和 5 之间的随机数

现在您可以找到您的 a 标签并将 href 修改为数组的随机元素

document.getElementById('img-hover').href = locations[url]

【讨论】:

  • 所以它看起来像这样?
  • 不一定,我给你的代码都是放在script标签里的。因为您搜索document.getElementById('img-hover'),您将选择该标签并将其href 设置为“位置”中5 个url 中的1 个。但是,您仍然必须自己输入网址数据......它不应该是var locations = [url1, url2,...],而是var locations = ["www.google.com", "www.stackoverflow.com",...]
【解决方案2】:

试试这样的方法,当然,用你自己的替换 URL。

<a href="#" onclick="randomUrl();" target="_blank"><img id="img-hover" src="image"/></a>
var urlArray = [
    "http://www.google.com",
    "http://www.yahoo.com",
    "http://www.stackoverflow.com"
];

function randomUrl() {
    var randomNumber = Math.floor(Math.random() * urlArray.length);
    var newUrl = urlArray[randomNumber];
    window.location.href = newUrl;
}

JSFiddle

【讨论】:

  • 是否可以不用输入每个链接,而是从域中选择一个?我的网站很大,我真的不想粘贴每个人,当我添加更多页面时必须编辑脚本。
  • 这比随机选择一个 URL 要大得多。我不相信 JavaScript 不能读取文件夹的内容,所以除非您有可以为其创建模式循环的明显排序的页面(page1、page2、page3、page4),否则您需要某种服务器-用于解析目录中所有 URL 的 side 元素。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2015-12-16
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多