点击左边a标签通过iframe在右边显示内容 

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
    </head>
    <style type="text/css">
            div:nth-of-type(1){border: 1px solid #000;width: 500px;height: 200px;}
            div:nth-of-type(2){border: 1px solid #000;width: 500px;height: 200px;}
    </style>
    <body>
         <div>
             <a href="demo1.html" onclick="myjs(this); return false;">点击</a>
             <a href="demo2.html" onclick="myjs(this); return false;">点击</a>
             <a href="demo3.html" onclick="myjs(this); return false;">点击</a>
         </div>
         <div id="demo1">
             <iframe  frameborder="0" ></iframe>
         </div>
    </body>
    <script type="text/javascript" src="jquery-2.1.4.js"></script>
     <script type="text/javascript">
               function myjs(a){
                 var aa = $(a).attr('href')
                 $("#demo1 iframe").attr('src',aa);
                 console.log(aa)
               }
     </script>
</html>

 

posted @ 2017-05-08 10:56  xuanPhoto  阅读(593)  评论(0)    收藏  举报