Question

我想用HTML将HTML页面加载到iFrame中，而不是使用通常的iFrame目标。很长的故事。这就是我需要它的方式。我的Javscript是

onclick = function buttonLife() {
    var el=document.getElementById("divContent");
    el.innerHTML="<iframe width=1024 height=702 scrolling=no name=bottomFrame frameborder=0 src=page.html></iframe>";
}

我的HTML是：

<a href="#" onclick="buttonLife();">BUTTON</a>;

它有效。但它加载了一个已由上述java函数定义的页面。但是，如果我想使用以下HTML将页面加载到每个按钮的iFrame变量中：

<a href="#" onclick="buttonLife('page2.html');">BUTTON2</a>

我知道我需要将has函数更改为

onclick = function buttonLife() {
    var el=document.getElementById("divContent");
    el.innerHTML="<iframe width=1024 height=702 scrolling=no name=bottomFrame frameborder=0 src='link'></iframe>";
}

但它不起作用。救命！感谢

Answer 1

您创建的功能不接受任何参数;你试图传递它'page2.html'，但它不期望这个输入。
您还期望link变量自动插值，但Javascript不会在字符串中插入变量。相反，解决方案是将变量与字符串连接起来。
onclick = function buttonLife()可能不会按照您的意图行事;它的作用是定义一个名为buttonLife的函数，并将其存储到一个名为onclick的变量中。相反，您只想创建函数buttonLife()。

以下是为解决上述问题而纠正的功能：

function buttonLife( page ) {
    var el=document.getElementById("divContent");
    el.innerHTML="<iframe width=1024 height=702 scrolling=no name=bottomFrame frameborder=0 src='" + page + "'></iframe>";
}


<a href="#" onclick="buttonLife('page2.html');">BUTTON2</a>

MDN's guide to Javascript是一个很好的基本介绍，可以帮助您避免这些问题。

Answer 2

所以我拿了你的代码并在jsfiddle中试了一下它运行正常： http://jsfiddle.net/ZK2VB/

我做了以下更改：

删除了无意义的onclick =
制作它以便您可以将URL传递给变量pageUrl
当您点击不移动页面的链接时删除了href="#"
我添加了<div id="contentDiv">

但这些只是化妆品/创造现实世界的实施。

如果您使用代码我应该可以使用，除非您有其他问题，例如您在某处重新定义了函数，或者您尝试在定义之前调用该函数。

Answer 3

试试这个：

function buttonLife(page_url)
{
  var el = document.getElementById("divContent");
  el.innerHTML = "<iframe width=1024 height=702 scrolling=no name=bottomFrame frameborder=0 src=" + page_url + "></iframe>";
}

另外，我建议你使用：

<a href="javascript:buttonLife('page1.html')">BUTTON</a>;

使用JS加载iFrame时使链接变量

3 个答案: