Javascript 切换包含另一个html页面的div

我一直在尝试制作一个按钮，打开一个包含另一个html页面的div。我有按钮的工作，但主页打开与div显示已经，我需要它隐藏。在把事情搞砸之后，我被困在这件事上了。按钮坏了

html

<p>Press the button</p>
<button id="button1" onClick="show()">Show / Hide</button>
<div id="Ahover">
    <object type="text/html" data="http://validator.w3.org/"></object>
</div>

js

有什么帮助吗，我做错了什么？这可能吗

---

谢谢，通过将脚本移动到标记中，最终使其正常工作。

请查看此处的工作演示- 唯一的更改是从按钮中删除show（）函数，因为您已经将jQuery click事件应用于它

按下按钮
显示/隐藏

并确保包含jQuery库。

请尝试以下代码：

HTML:

JS:

演示在这里：

html:

---

js fiddle:

我在小提琴上工作。但是，当我把它输入到我的代码中时，由于某种原因它不起作用。我加载了库，链接了css表，但是按钮什么也没做。这里只是试着测试一下，按钮不起作用。对不起，如果我忽略了一些非常简单的东西。别担心，只要把脚本标签放在正文部分的末尾，它就会工作。

#Ahover {
    display:none;
    overflow: hidden;
    border:1px ridge blue;
}
object {
    width:760px;
    height:600px;
}

$('#button1').click(function(){
   $('#Ahover').toggle() 
});

<p>Press the button</p><button id="button1">Show / Hide</button>
<div id="Ahover"> 
<object type="text/html" data="http://validator.w3.org/" >
</object></div>

#Ahover {
display:none;
overflow: hidden;
border:1px ridge blue;
}
object {
width:760px;
height:600px; 
display:inline-block
}

$('#button1').on('click',function(e){
 $('#Ahover').toggle();
});

<p>Press the button</p><button id="button1" >Show / Hide</button>
<div id="Ahover"></div>

$('#button1').click(function(){
$('#Ahover').toggle();
 $("#Ahover").html('<object data="http://validator.w3.org/" />');
});

div {
    height: 100%;
}

object {
    width: 100%;
    min-height: 100%;
}