3

我的程序的目的：

单击“外部页面”超链接后，将执行 javascript 函数“randomLink”，该函数应动态提供指向 IFrame 幻想框的链接；这反过来应该加载这个提供的链接。

问题

目前我遇到的问题是：不是按照上面总结的方式行事，而是将一个链接分配给“data-src”属性，从运行时的这一点开始，我无法替换该值这个属性再次动态。

如何直观地看到问题：

通过 javascript 警报消息表示的 'd.getSeconds()' 值和馈送到 Fancybox IFrame 的 'duckduckgo' URL 的比较使这个问题变得明显。

当第一次执行超链接“外部页面”时，“duckduckgo”URL 与 JS 警报中显示的当前“d.getSeconds()”值匹配，但此后再次选择超链接时，这些值将不再匹配。而对于 URL，第一个 'd.getSeconds()' 值将在 Fancybox IFrame 中执行，与预期的新 'd.getSeconds()' 值相反。

任何帮助解决这个问题将不胜感激。

谢谢。

CodePen 问题链接：

http://codepen.io/anon/pen/yMNxrK

html:

<p>

  <a data-fancybox data-src="" href="javascript:;" onclick="randomLink(this)">
    External page
  </a>

</p>

Javascript：

function randomLink(a) {

var d = new Date();
alert(d.getSeconds())

a.setAttribute('data-src', 'https://duckduckgo.com/?q=' + d.getSeconds());
}
4

1 回答 1

2

我看到的问题是该data-fancybox属性将元素绑定<a>到fancybox，因此与该onclick属性冲突。

我会用不同的方法解决“问题”，方法是onclick只使用属性来调用你的randomLink函数，然后在随机创建目标源后以编程方式在该函数内触发fancybox，所以

的HTML：

<a href="javascript:;" onclick="randomLink()">External page</a>

JavaScript：

function randomLink() {
  var d = new Date();
  alert(d.getSeconds())
  var href = 'https://duckduckgo.com/?q=' + d.getSeconds()
  $.fancybox.open({
    src: href,
    type: 'iframe',
    opts: {}
  })
}

分叉笔： http ://codepen.io/anon/pen/dvYbrN

于 2017-02-28T02:12:49.163 回答