开发者问题收集

为何我的 javascript 函数失败？

2013-05-17
75
javascript html

我希望此代码显示一个名为“地图”的按钮。按钮上方应显示“选择显示”文本。单击“地图”按钮后，它会通过标签显示谷歌地图图像。 

<html>
<head>

<title>Random</title>

</head>
<body>


<p align="center"style="font-family:verdana;"id="googlemap">
Choose a Display
</p>

<script>
function mapFunction()
{
x=document.getElementById("googlemap");  // Find the element
x.src="<iframe width="640" height="480" frameborder="0" scrolling="no" marginheight="0"     marginwidth="0" https://www.google.com.au/maps?f=d&amp;source=s_d&amp;saddr=23+Burgundy+St,+Carseldine+QLD&amp;daddr=90+Gilbert+Rd,+Grange+QLD+to:Narrowneck+Court+Surfers+Paradise,+204+Ferny+Ave,+Surfers+Paradise+QLD&amp;hl=en&amp;geocode=FfOeXv4d6qweCSn9XcBQSP2TazGVQ_0hH3aSYA%3BFRKQXf4d5_QeCSlRy4j_0lmRazEdtrkd8CRD0Q%3BFWXtVP4dWCUlCSGK90q-pKXOZCmv-18SewWRazGK90q-pKXOZA&amp;aq=0&amp;oq=Narr&amp;sll=-27.422699,153.02411&amp;sspn=0.004819,0.008272&amp;t=h&amp;mra=ls&amp;ie=UTF8&amp;ll=-27.555764,153.208466&amp;spn=0.584401,0.878906&amp;z=10&amp;output=embed"></iframe>;    // Change the content
}
</script>

<button type="button" onclick="mapFunction()">Map</button>


</body>
</html>
3个回答

我认为您的意思是 innerHTML 

var x = document.getElementById("googlemap");  // Find the element
x.innerHTML = '<iframe src="url here" ...></iframe>';

由于 HTML 包含 " ，您可以使用 \ 对它们进行转义，或者只用单引号 ' 将整个字符串括起来。

此外，您忘记了 iframe 的 src 。

Joseph
2013-05-17

两件事：

  • 您不想更改 x 的 src ，而是尝试修改 innerHTML 。

  • 您的 iframe 标记格式错误（URL 应以 src=" 作为前缀，并且不存在 marginwidth 或 marginheight 属性），并且未正确包含在字符串中（所有双引号都应转义为 \"like this\" ）

因此，这应该有效： 

function mapFunction()
{
    x=document.getElementById("googlemap");  // Find the element
    x.innerHTML = "<iframe width=\"640\" height=\"480\" frameborder=\"0\" scrolling=\"no\" style=\"margin-height:0;margin-width:0;\" src=\"https://www.google.com.au/maps?f=d&amp;source=s_d&amp;saddr=23+Burgundy+St,+Carseldine+QLD&amp;daddr=90+Gilbert+Rd,+Grange+QLD+to:Narrowneck+Court+Surfers+Paradise,+204+Ferny+Ave,+Surfers+Paradise+QLD&amp;hl=en&amp;geocode=FfOeXv4d6qweCSn9XcBQSP2TazGVQ_0hH3aSYA%3BFRKQXf4d5_QeCSlRy4j_0lmRazEdtrkd8CRD0Q%3BFWXtVP4dWCUlCSGK90q-pKXOZCmv-18SewWRazGK90q-pKXOZA&amp;aq=0&amp;oq=Narr&amp;sll=-27.422699,153.02411&amp;sspn=0.004819,0.008272&amp;t=h&amp;mra=ls&amp;ie=UTF8&amp;ll=-27.555764,153.208466&amp;spn=0.584401,0.878906&amp;z=10&amp;output=embed\"></iframe>";    // Change the content
}
Simon M
2013-05-17

p 元素永远不能具有 src 属性。或者您使用空的 src 值创建 iframe / 或者您使用 x.innerHTML 来写入 iframe。

正如其他人之前所说，您需要“转义引号”

Kevin
2013-05-17