Question

这就是我想要做的事情：

我在网页中有很多锚点，有些是用ajax管理的，因为它们被绑定到带有jquery的click事件;有些不是这样，他们通过常规的http请求发送到另一个页面。

<a href="#/something" >something</a>
<a href="#/ajax/something" class="blabla">ajax something</a>

<script type="text/javascript">
    $(function(){
       $('.blabla').click(function(){
          //doing some ajax return false so anchor don't redirect
          return false;
       });
    });
</script>

请不要回应关于锚定的问题，比如'嘿选择所有没有“blabla”类的锚。我这样做是因为我正在试图在页面上为每个未通过ajax管理的锚点放置一个“等待”标签。我想知道一个锚是否有一个绑定到自身的点击事件。

问候。

Answer 1

这有效 - 想法是：

存储最初加载页面时数组中每个click元素存在的<a>个事件数。
然后，每隔500ms左右，将每个锚点上click个事件的长度与存储在数组中的长度进行比较

-

$(function() {
  i = 0;
  window.ahrefEvents = [];
  $('a').each(function() { 
    $(this).attr('data-id', i); //give each anchor a unique id and save it the data-id attribute. we'll then save the number of events for each link in window.ahrefEvents
    window.ahrefEvents[i] = $._data($(this)[0], 'events') == undefined ? 0 : $._data($(this)[0], 'events')['click'].length; //if no events are bound it'll return undefined, so check for that and set it to 0 if that's the case
    i++;
});


window.setInterval(function() { //check every 500ms to see if that length changed
    checkEvents();
}, 500);

window.checkEvents = function() {
    $('a').each(function() {
        index = $(this).attr('data-id');
        if ($._data($(this)[0], 'events') != undefined) {
            if (window.ahrefEvents[index] != $._data($(this)[0], 'events')['click'].length) {
                //fires when length of click events on any anchor has changed
                console.log('event bound on anchor #' + index);
            }
        }
    });
  }
});

演示：http://fiddle.jshell.net/CyYbA/20/show/

尝试拉出控制台并将某些内容绑定到$('#test')对象

在此编辑小提琴：http://jsfiddle.net/CyYbA/20/

Answer 2

也许您可以使用jquery data函数存储这些锚点的附加信息？

Answer 3

如果您的AJAX网址系统始终在路径中包含ajax，您可以根据href构建选择器

var $noAjaxLinks= $('a').filter(function(){

      return ! /ajax/.test(this.href);
})

Answer 4

好吧，这就是我到目前为止所做的：

<ul class="nav nav-list">
    <li><a href="content.php" class="load">content via .load()</a></li>
    <li><a href="content.php" class="get">content via $.get()</a></li>
    <li><a href="content.php" class="post">content via $.post()</a></li>
    <li><a href="content.php" class="ajax">content via $.ajax()</a></li>
    <li><a href="content.php" class="">content 2 without ajax()</a></li>
</ul>

一些jquery事件绑定

$('a.load').click(function(){
    $("#container").loader().load($(this).attr('href'));
    return false;
});
$('a.get').click(function(){
    $.get($(this).attr('href'), function(d){
        $('#container').html(d);
    });
    return false;
});

我有很多锚，一个没有ajax，另一个有不同的ajax调用这就是我期望在页面中找到的内容。我的代码必须捕获所有这些并评估哪一个没有ajax调用来对待它不同

这是代码。

//looking just for one anchor
$('a').each(function(idx, obj){
    var events = $._data(this,'events');
    if (typeof events != "undefined" && "click" in events) {
        for (i in events.click) {
            if (typeof events.click[i].handler != "undefined") {
                 var f = events.click[i].handler.toString();
                 if ((/\$(\(.*\))?\.(load|ajax|get|post)\(/).exec(f)) {
                    console.log('obj '+$(this).text()+' : with ajax.');
                    //this is where i'm gonna deal with this regular http anchor...
                 }
            }
        }
    }
});

希望这有助于另一个遇到同样问题的人。问候。

如何使用jquery检测事件绑定到元素

4 个答案: