我已经阅读了很多关于不引人注目的JS以及如何生成它以及所有爵士乐......
我的问题是:我的网站严重依赖mod_rewrite
,因此基本上所有网页请求都会发送到生成网页主体结构的index.php
,然后包含相应的网页。现在,网站中有不同的部分,每个部分使用不同的Javascript函数(例如,针对不同的AJAX请求)。
现在,如果我只是将一个函数附加到页面的onload
,显然事情就不会起作用,因为我不必为每个页面初始化相同的东西......那么什么是处理这种情况的最佳方法是什么?
我希望情况很清楚,如果需要我会很乐意澄清
答案 0 :(得分:3)
您可以在辅助PHP页面生成的HTML中使用addEventListener
(标准)或attachEvent。
语法很简单。 E.g。
document.addEventListener("load", someFunction, false);
这允许您在index.php中生成完整的正文标记,但为每个页面运行不同的加载处理程序。另请注意,您可以在同一元素上多次使用它。
答案 1 :(得分:1)
Nico,我建议为每个包含的页面创建一个自定义的javascript代码(在页面上包含脚本标记的位置无关紧要),并且正如Matthew建议的那样,在定义要在页面加载上运行的函数后,使用addEventListener在“加载”上加载自定义函数
假设您在所包含文档的主体中的某处定义了一个函数pageinit()
function pageinit(){..
}
window.addEventListener("load", function() { pageinit(); }, false);
这对你的项目有意义吗?
答案 2 :(得分:1)
我只是将它放在.js文件中。
mysite_common.js - 站点范围的常用工具和函数
mysite_page_a.js - 第a页的唯一功能
mysite_page_b.js - 第b页的唯一功能
对于第b页,您包括b.js,而在第a页上您将包含a.js
然后在各自的unique.js中,您可以将您的功能包含在ondomready或类似的内容中。
将它与PHP分开,然后它不再是一个烦恼,它也意味着你可以依靠缓存来保持你的页面负载更轻薄。
您还可以查看YUI加载器之类的内容,它允许您执行更复杂的操作,例如按需加载js功能。
您可以根据上下文使用事件委派来提供不同的功能。
基本上它通过将事件侦听器附加到容器元素来实现,该容器元素捕获对子元素的点击。然后,您可以完全取消单个事件侦听器,以及查看父级的提示。 说:
<div id='container' class='page_a'>
...
<input name='somename'>
...
</div>
然后
var attachDelegates = function(container){
container.onclick = function(e) {
e = e || window.event;
var t = e.target || e.srcElement;
//Your logic follows
if(t.name === 'somename'){
dosomething(t);
}
if(t.className === 'someclass'){
... something else ...
}
};
和onload = function(){attachDelegates('container');};
对于每个页面,attachDelegates函数可能不同,或者您可以对容器具有单一的附加提示和简单的附加提示,或者选择您附加的类。
这些是更为连贯的解释和例子:
http://cherny.com/webdev/70/javascript-event-delegation-and-event-hanlders
http://blog.andyhume.net/event-delegation-without-javascript-library
我个人使用YUI3 http://developer.yahoo.com/yui/3/examples/node/node-evt-delegation.html
因为它给了我CSS3风格的选择器,到目前为止非常麻烦。