javascript – 在加载jQuery之前阻止链接

如何在加载jQuery之前阻止点击事件上的链接？
原因是我有很少的链接通过jQuery ajax函数调用 AJAX,如果用户在加载jQuery框架之前单击它们,浏览器无法触发jQuery ajax函数并将跟随链接href =“…”
谢谢.

编辑：我可以用这个吗？

<head>
...
  <script type="text/javascript">
   window.onload = prevCl();
   function prevCl() {
    var links = document.links[];
    links.onclick = check();
   }
   function check() {
    if (typeof jQuery == 'undefined') { 
     return false;
    }
   }
  </script>
</head>

解决方法

四种选择：

选项0

去读Sean Hogan’s answer,他指出这可以通过委托(doh！)完成,并且我将一个示例实现放在一起.

选项1

您可以将链接的href设为“#”,直到加载jQuery,然后(如果适用)将其更改为它应该是什么.您可以存储href应该在数据属性中的内容,例如：

<a href='javascript:;' data-href='realtarget.html'>blah</a>

然后：

jQuery(function($) {
    $("a[data-href]").each(function() {
        var $this = $(this);
        $this.attr("href",$this.attr("data-href"));
    });
});

再次,只有当你真的需要使href成为href时才是最后一点.如果您通过JavaScript处理点击,则无需.

如果验证是开发周期的重要部分,请务必注意,data-xyz形式的属性在HTML4和之前是无效的(浏览器实际上并不关心,但如果使用验证,则再次……).它们从HTML5开始有效.

选项2

在jQuery加载之前使用内联onclick属性拦截点击,基本上说“抱歉,一刻”.因此,在文件顶部的脚本标记中：

function sorryLoading() {
    alert("Sorry,the page is still loading,one moment please.");
    return false;
}

…然后在链接上：

<a href='realtarget.html' class='sorry' onclick='return sorryLoading();'>blah</a>

…然后删除jQuery加载上的onclick：

jQuery(function($) {
    $("a.sorry").removeClass('sorry').attr("onclick","").click(yourRealClickHandler);
});

(如果他们没有相同的点击处理程序,你可以留下最后一点 – 点击呼叫 – 关闭.)

我已经使用上面的一个类来区分这些链接和其他可能具有内联onclick的链接(否则,令人惊讶的是选择器“a [onclick]”实际上适用于Chrome,Opera和Firefox for Linux以及Windows上的IE6和IE8) .

选项3

因为听起来你希望页面在jQuery加载之前不起作用,所以这是另一种方法：

>确保jQuery的脚本标记位于页面的head部分(不在底部,我通常建议将其放在底部).
>在页面的最底部,在关闭body标签之前,挂钩您的单击处理程序,而不将它们包装在jQuery.ready调用(或其任何快捷方式)中.

原因是：#1将确保在呈现页面之前加载jQuery本身,而#2将尽快连接处理程序.谷歌建议在页面末尾使用一个标签(而不是一个现成的功能或类似的),并说在那时,DOM元素将可以被发现.

当然,另外,您希望通过执行所有页面加载优化,确保链接不能满足用户期望的时间绝对尽可能简短.单击一个链接而不使它看起来像它确实会导致糟糕的用户体验.

javascript – 在加载jQuery之前阻止链接

解决方法

相关文章