如何根据页面分离jQuery事件侦听器？

我送花儿给人有，我有包含事件处理程序在我的网站多个页面一个.js文件，像这样的情况：如何根据页面分离jQuery事件侦听器？

$(function() { 
$('#my-textbox1').click(function(){ doSomthing(); }) //--> this my-textbox1 exists in page example1.aspx 
$('#my-textbox2').click(function(){ doSomthing(); }) //--> this my-textbox2 exists in page example2.aspx 
});

现在假设用户打开的页面example1.aspx，jQuery将搜索我的文本框1，如果发现它会附加一个点击事件，然后将搜索我的文本框2，不会找到它，并不会附加事件。

但是像这样的jQuery在所有情况下将在所有网页我，TextBox2中搜索，

我想知道的是你做，以避免不必要的选择，以获得所谓的不想要的页面的最佳实践他们。

可能是2个事件不是大问题，但假设我有数百个要附加的事件，这肯定会影响页面加载性能。

来源

2010-12-18 Amr Elgarhy

在我们的项目中，我们总是使用基于body类的视图模式。这是一个规定的例子：

views = { 
    home: function() { 
    // do stuff on home page 
    }, 
    products: function() { 
    // do other stuff on products page 
    } 
}; 

$.each(document.body.className.split(' '), function() { 
    if (this in views) { 
    views[this](); 
    } 
});

来源

2010-12-18 21:24:39 David

这是我见过的最优雅，最简单的方法之一。 – 2010-12-23 23:52:52

我不知道这个解决方案有多好。我只是把它当我走了。

第一个。你很可能有一些意见装点你的JavaScript像这样

//[all] 
$(function() { 
//[example1.aspx] 
$('#my-textbox1').click(function(){ doSomthing(); }) //--> this my-textbox1 exists in page example1.aspx 
//[/example1.aspx] 

//[example2.aspx]  
$('#my-textbox2').click(function(){ doSomthing(); }) //--> this my-textbox2 exists in page example2.aspx 
//[example2.aspx] 
}); 
//[/all]

二：获取乌尔JS文件通过一个aspx页面提供服务（它也可以做W/O采用这种方式 - 使用HttpHandlers的）例如

GetJS.aspx的CodeBehind将从磁盘读取您的实际js文件到内存中。

当时看Referer的从请求头（这将指向已请求GetJS.aspx页面中的值（在我们的情况下，它会要么example1.aspx或example2.aspx）。

现在我们知道哪个页面已经请求了JS，我们可以根据评论装饰//[all],//[example1.aspx]等去掉它的内容，并且用适当的内容类型做一个response.writefile。

来源

2010-12-18 21:39:37 Omkar

$(function() { 

    var pn = window.location.pathname; 

    if (/example1/.test(pn)) { 
    $('#my-textbox1').click(function(){ doSomthing(); }); 
    } 

    if (/example2/.test(pn)) { 
    $('#my-textbox2').click(function(){ doSomthing(); }); 
    } 

});

来源

2010-12-23 13:53:57

如何根据页面分离jQuery事件侦听器？

回答

相关问题