javascript - 如何使imagePreview不可点击

我使用了一个简单的imagePreview脚本来预览更大尺寸的图像，但是使用了它。作为全尺寸来源，

我如何更改它以使链接不可点击，
香港专业教育学院试图更换一个。与跨度。但预览未加载。

参见jsfiddle：
http://jsfiddle.net/7FLbU/

HTML代码：

<div class="image"><a href="https://www.google.com/images/srpr/logo11w.png" class="preview"><img src="https://www.google.com/images/srpr/logo11w.png"/></a></div>

Javascript：

this.imagePreview = function(){
        xOffset = 10;
        yOffset = 30;
    $("a.preview").hover(function(e){
        $("body").append("<p id='preview'><img src='"+ this.href +"'/></p>");
        $("#preview")
            .css("top",(e.pageY - xOffset) + "px")
            .css("left",(e.pageX + yOffset) + "px")
            .fadeIn("fast");
    },
    function(){
        $("#preview").remove();
    });
    $("a.preview").mousemove(function(e){
        $("#preview")
            .css("top",(e.pageY - xOffset) + "px")
            .css("left",(e.pageX + yOffset) + "px");
    });
};
$(document).ready(function(){
    imagePreview();
});

CSS：

.image {
float: left;
padding: 0px 10px 10px 0px;
}

.image img {
max-width: 240px;
max-height: 290px;
}

#preview{
position:absolute;
border:1px solid #0096B8;
background:#0096B8;
padding:5px;
display:none;
color:#fff;
max-width:500px;
border-radius: 4px;
}

#preview img {
max-width:500px;
}

最佳答案

使用event.preventDefault()阻止浏览器在单击按钮时执行默认操作

$('a.preview').click(function(e){
    e.preventDefault();
})

文档：http://api.jquery.com/event.preventdefault/

或使用return false;

$('a.preview').click(function(e){
    return false;
})

Fiddle Demo