js实现页面局部刷新，求大神指教！！

[无笙何惧]

问题，我想实现的功能是点击导航链接实现页面主体部分的页面刷新，但是在采用下面的代码时，页面整体刷新了，求大神们指教错误之处！！！感谢！！！
1.导航链接部分

<dd data-name="console" class="layui-this">
       <a href="../repair/test.php">我要报修</a>
 </dd>

2.页面主体部分

<div class="layui-body">
        <!--<div style="padding: 15px;">内容主体区域</div>-->
        <iframe id="iframeMain" src="../repair/test.php" style="width: 100%"; height="100%";>

        </iframe>
</div>

3.js部分

$(document).ready(function(){
    $("dd>a").click(function (e) {
        //设置a的点击事件不跳转到另一个页面
        e.preventDefault();
        $("#iframeMain").attr("src",$(this).attr("href"));
    });
});

4. 测试页面
点击链接前

点击链接后

[similing]

你click的事件应该返回false。 不推荐这么写，你可以把a标签改成div或者span，然后通过css设置cursor:pointer来模拟a标签外形行为。或者你可以为a标签href指定target为iframe的id

[无笙何惧]

返回false和<a href="../repair/test.php" target="iframeMain>后仍然刷新的是整个页面

[luj_1768]

这是个与框架设计有关的问题，需要查看一下框架关于空操作和数据不符合要求时的处理方案。

[无笙何惧]

好吧，我用了另一种方法

function toRepair(){
        document.getElementById("iframe").src="../repair/toRepair.php";
 }

[上海程序员3]

用 innerHTML

[Hello World,]

iframe加name，a加target