通过单击链接填充容器...当前在加载时执行此操作

本文介绍了通过单击链接填充容器...当前在加载时执行此操作的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

<script type="text/javascript">

$(document).ready(function() {
$("a").click(function(event) {
  alert("Thanks for visiting!");
  });
 });
</script>

<style>
 div.iframe-link {
 position: relative;
 float: left;
 width: 175px;
 height: 205px;
 margin: 0 1em 1em 0;
 border: 3px solid blue;
 }

  a.iframe-link {
  position: absolute;
  top:0;
  right: 0;
  bottom: 0;
  left: 0;
}
</style>
</head>

<body>

<a href="swedish.html">click link to populate container</a><br>  

<!-- note: it populates the container at load currently ... I only want it to 
populate     after clicking the link -->  
<div class="iframe-link">  
<iframe src="swedish.html?style=sandbeach" style=" border-width:2 " width="175"     
height="175" frameborder="2" scrolling="no"></iframe>
</div>   


</body>
</html>

推荐答案

您需要在点击处理程序中return false.

You need to return false in your click handler.

此外，在某些浏览器中，这可能还不够->您还应该致电preventDefault().

Also, in some browsers, that may not be enough -> you should also call preventDefault().

这是一个可行的示例:

$( function() {
    $( "a" ).click( function( e ) {
        $('.iframe-link').html( '<iframe src="swedish.html?style=sandbeach" style=" border-width:2 " width="175" height="175" frameborder="2" scrolling="no"></iframe>' );
        e.preventDefault();
        return false;
    });
});

这篇关于通过单击链接填充容器...当前在加载时执行此操作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！