使用JS从HTML生成链接

时间:2018-06-06 17:09:13

标签: javascript

您好我试图让我的页面在动画播放后打开指向我网站上某个页面的链接(让我们知道并告诉他们明星褪色)

如果我有3张卡片,当我点击它们时,我想要播放相同的动画,等待1500毫秒,然后打开指向新页面的链接(在同一个标​​签页中)。

我喜欢这样做,只需在HTML中设置a href或window.location,然后使用JS查询来提取链接信息

抱歉,如果这太模糊了,这是我与JS的第二天,我不知道我还不知道

HTML

<div class="link1" window.location="index1.html"></div>           
<div class="link2" window.location="index2.html"></div>
<div class="link3" window.location="index3.html"></div>

Javascript

open() {

this.isOpened = true;

this.elm.classList.add('is-opened');

this.timeStart = Date.now();

this.renderLoop();

setTimeout(function() { window.location = document.getElementsByName('window.location')}, 1500);

  }

2 个答案:

答案 0 :(得分:0)

这是您在属性data-link中设置网址的一种方式。 E.g。

const links = document.querySelectorAll('.link');
for(var link of links) {
  link.addEventListener('click', function(e) {  
    setTimeout(function() {
      window.open(e.target.getAttribute('data-link'), '_blank');
    }, 1500)
  })	
}
<div class="link" data-link="index1.html">Link-1</div>           
<div class="link" data-link="index2.html">Link-2</div>
<div class="link" data-link="index3.html">Link-3</div>

如果您确实要在新标签页中打开链接,请确保如果未设置“allow-popups”权限,大多数浏览器都不允许这样做。否则只需替换

window.open(e.target.getAttribute('data-link'), '_blank');

window.location = e.target.getAttribute('data-link');

答案 1 :(得分:0)

  1. 您正在定义一个属性并尝试将其称为名称 - &#34; window.location&#34;和document.getElementsByName返回一个数组,所以你必须像document.getElementsByName [0]一样使用它,但那是你不需要的东西

  2. &#34;开&#34;是一个预定义的方法,使用其他名称并在div上发生单击时调用它

  3. 我认为这就是你想要的

    &#13;
    &#13;
    <div class="link1" data-location="index1.html" onclick="openLink(this)">asdas</div>           
    <div class="link2" data-location="index2.html" onclick="openLink(this)"></div>
    <div class="link3" data-location="index3.html" onclick="openLink(this)"></div>
    &#13;
    FramLayout
    &#13;
    &#13;
    &#13;

    在这里检查工作小提琴 https://codepen.io/ajanth2012/pen/MXaPpp