Question

<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>

Answer 1

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

此外，在某些浏览器中，这可能还不够 - ＆gt;你也应该致电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;
    });
});

Answer 2

像这样的东西：

$( function() {
        $( "a" ).click( function() {
            var link = $(this).attr("href");
            $('.iframe-link').html( '<iframe src="'+ link  +'"></iframe>' );
            return false;
        });
 });

Answer 3

像这样：

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

请注意，这将处理所有超链接的点击事件，这可能不是您想要的。

您应该使用更具体的选择器;最好的办法是给你的<a>元素一个类或id。

Answer 4

类似的东西：

jQuery(function($) {
  $('a').click(function() {
    $('.iframe-link').load("swedish.html?style=sandbeach");
    return false;
  });
});

Answer 5

http://docs.jquery.com/Events/jQuery.Event#event.preventDefault.28.29

我会使用preventDefault( )

$("a").click(function(event){
  event.preventDefault();
  // do something
});

但实际上，我假设你在幕后做同样的事情。但是，我相信jQuery应该知道我可能不知道的任何浏览器怪癖（这可能会使它在特殊或复杂的情况下执行return false;之外的其他操作。）

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

5 个答案: