使用mailto打破淡入淡出的页面转换

时间:2014-01-07 16:46:58

标签: javascript jquery html css

如果您点击链接,它会淡出页面并转到新页面。当你被带到另一个网站时,这很好。

但是,对于简单的<a href="mailto:hello@example.com">,这根本不起作用。为什么?因为你实际上并没有去任何地方。因此,您将获得一个空白页面和一个打开的邮件客户端。这是一个例子:

JSFIDDLE

function fadeAndGo(x) {

        $(x).click(function (e) {
        e.preventDefault();
        var href = this.href;
        $('.wrapper').fadeOut(function(){
            window.location = href;

        });
    });
}

fadeAndGo('a');

是否可以定位属于href的广告,而不是定位所有'a'标记?或者选择忽略那些以mailto:开头的链接?

任何帮助都将不胜感激。

3 个答案:

答案 0 :(得分:2)

是的,仅限CSS选择器。 jQuery会考虑浏览器兼容性,否则它将适用于IE9 +

fadeAndGo("a:not([href^='mailto:'])");

答案 1 :(得分:0)

您可以在更改window.location值之前检查href属性:

$('.wrapper').fadeOut(function () {
        if (href.indexOf('mailto') == -1) {
            window.location = href;
        }
}

DEMO

答案 2 :(得分:0)

这应该有效:

fadeAndGo('a[href^="http"]');

JSFiddle here

编辑:我刚想到这对包含相对网址的链接不起作用,所以我建议改用@ Germain的答案。