如何添加 iframe 默认内容页面答案

【问题标题】：How to add Iframe default content page如何添加 iframe 默认内容页面
【发布时间】：2016-08-13 09:07:38
【问题描述】：

我使用 iframe 创建了一个动态加载页面。加载时，它会在正文区域显示空白区域，直到我单击页面链接。框架加载时如何添加默认页面。

<html>
<head>
<script type="text/javascript" 
src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js">
</script>
<script type="text/javascript">

$(document).ready(function(){
     $(".divlink").click(function(){
     $("#content").attr("src" , $(this).attr("ref"));
});
});

</script>
</head>
<body>
  <iframe id="content"></iframe>
    <a href="#" ref="page1.html" class="divlink" >Page 1</a><br />
    <a href="#" ref="page2.html" class="divlink" >Page 2</a><br />
    <a href="#" ref="page3.html" class="divlink" >Page 3</a><br />
    <a href="#" ref="page4.html" class="divlink" >Page 4</a><br />
    <a href="#" ref="page5.html" class="divlink" >Page 5</a><br />
    <a href="#" ref="page6.html" class="divlink" >Page 6</a><br />
</body>
</html>

【问题讨论】：

是否要为首页内容显示页面内容？
是的。当它加载时，我想显示一个页面。现在它显示为空白
那么为什么不将 iframe src 设置为第一个链接 ref?!

标签： javascript jquery html iframe

【解决方案1】：

请检查下面的sn-p。在这种情况下，它将从第一个“a”元素加载页面。

$(document).ready(function(){
    $("#content").attr("src" , $("a.divlink:first").attr("ref"));
    $(".divlink").click(function(){
         $("#content").attr("src" , $(this).attr("ref"));
    });
});

【讨论】：

【解决方案2】：

使用 iframe src 属性

<iframe id="content" src="page1.html"></iframe>

【讨论】：