如何将函数绑定到DOM事件一次且仅一次,以便它们在触发事件时不会再次执行?

Neo*_*Neo 5 javascript jquery jquery-ui jqgrid

所以我有锚标签的形式,<a href='[link'] rel='Tab'>并在页面加载时应用以下内容:('文件准备'我的意思是)

jQuery("a[rel*=Tab]").click(function(e) {
                e.preventDefault();//then I do some stuff to open it in jq ui tab}
Run Code Online (Sandbox Code Playgroud)

现在的问题是,当我这样做,之后通过javascript生成新的链接,在我的情况下加载第二页与JqGrid有新<a rel='neoTab'>的,当我第一次运行时不存在, jQuery("a[rel*=Tab]").click(function(e)所以他们将无法工作...所以我可以jQuery("a[rel*=Tab]").click(function(e)在每个创建新链接的事件上运行 但是旧的链接会加载多个标签,那么有没有办法可以选择a[rel*=Tab]以前没有选择的所有" ?"

注意:我可以并且已经通过算法方法解决了这个问题,因为您可以通过下面的详细信息看到,我只是认为有一些我不知道的语法可以防止使用这个hack!

不必要的细节:

var neoTabitStat = 0;
var openTabs = new Array();
openTabs[0] = 'inbox';
if(!(currentBox=='inbox'||currentBox=='outbox') ) {var currentBox = 'inbox';}

function initNeoTab(a){
    if(neoTabitStat==0) {
        jQuery("a[rel*="+a+"]").click(function(e) {
            e.preventDefault();
            tabIt(jQuery(this).attr('href')+'&nohead=1',jQuery(this).attr('title'),jQuery(this).attr('data-hovercard'));
        });
    neoTabitStat++;
    }
}

function tabIt(a,b,c) {
    c = typeof(c) != 'undefined' ? c : 0;
    lastOpen = openTabs.length;
    if(lastOpen<6) { 
        if(openTabs.indexOf(c)<0) {
            openTabs[lastOpen] = c;
            jQuery("#tabs").tabs("add" , a , b, lastOpen+1 );
        }
        $tabs.tabs('select', openTabs.indexOf(c) );
    }else{
        var tabErrDig = jQuery('<div style="display:hidden">You have opened the maximum amount of tabs please close one to open another tab.</div>').appendTo('body');
        tabErrDig.dialog({width:500,title:'Maximum Tabs Opened',modal: true,
                buttons: {
                    Ok: function() {
                        jQuery( this ).dialog( "close" );
                    }
                }
        });
    }
}

jQuery(document).ready(function() {  initNeotab('nameOfrelAttr4existingLinks'); }
myGrid = jQuery("#list").jqGrid({/*alot of stuff...*/} , gridComplete: function() { initNeotab('nameOfrelAttr4generatedLinks');
}
Run Code Online (Sandbox Code Playgroud)

更新: 正如Wrikken提出的jQuery().live我检查了它,这正是我需要的但我无法让它实际工作,它在某些情况下不起作用.对于其他写过不同解决方案的人,你是否熟悉.live()如果是这样,为什么我不能在这里使用它?

结论 特别感谢fudgey,patrick dw和wrikken.所有答案都很有帮助..delegate().为我工作,但由于某种原因.live()没有.关于jqGrid将元素添加到表中的方式.我要暂时保持这个问题.再次感谢您的帮助.全部+1

Mot*_*tie 1

我本来打算建议使用.one(),但看来您正在动态添加链接。因此,我最好向已单击的链接添加一个标志。正如帕特里克(Patrick)建议的那样,通过以下修改,委托将是最好的选择:

jQuery("#list").delegate( 'a[rel*=Tab]', 'click', function() {

 if ($(this).is('.alreadyClicked')) { return false; }
 $(this).addClass('alreadyClicked');

 // do something 

});
Run Code Online (Sandbox Code Playgroud)