只在特定页面上执行js的最佳方法 [英] Best way to execute js only on specific page
问题描述
让我们假设我们有一个基于模板的web站点，重写规则的内容ist设置，jquery可用，它基本上是这样的：
<！DOCTYPE html>
< html>
< head>
< script src =script.js>< / script>
< / head>
< body>
...
包含$ content;
..
< / body>
< / html>
内容'info'包含一个按钮，我们希望点击时发生一些事情，内容'alert'应该作为一个消息，当你悬停一个文本字段。
什么是触发这些动作的最佳方式，而不会遇到错误，因为对象是找不到？ 选项一：使用 window.location.pathname 选项二：检查是否存在元素 选项三：将脚本包含在加载模板 他们是更好的解决方案吗？或者我必须与其中一种解决方案相处吗？ 您的经验，使用情况或与此主题相关的任何链接都会受到赞赏。 //编辑： 我可能选择了一个不好的例子，实际的代码会有点像： 其中，myPicture构造函数获取canvas元素的上下文，并抛出错误，如果mCanvas未定义。 与检查URL路径有点不同：您可以将页面特定的事件处理程序分组到一个函数中，然后每个包括，都有一个domready将调用这些函数。 While在你的 I was wondering what would be the best way to execute a java-script code only on specific pages. Let's imagine we have a template-based web-site, rewrite rule for the content ist set, jquery available and it basically looks like this: content 'info' contains a button, we want something to happen on click, content 'alert' should give as a message, when you hover a text field. What is the best way to trigger these action, without running into an error, because the object is not found? Option one: using window.location.pathname Option two: checking if elements exists Option three: include the script in the loaded template Is their a better solution? Or do I have to get along with one of these solutions? Your experience, usage or any links related to this topic are appreciated. //EDIT: I might have choosen a bad example, the actual code would be somethin like: where the myPicture constructor get's the context of the canvas element, and throws an error, if mCanvas is undefined. A little different approach than checking the URL path : You can group page specific event handlers in a single function and then in each include, have a domready which will call these functions. Eg: in While in your 这篇关于只在特定页面上执行js的最佳方法的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
$（document）.ready（function（）{
if（window.location.pathname =='/info.php'） {
$（＃button1）。click（function（）{'
// do something
}）
} else if（window.location.pathname ==' （）'
$（＃mytextfield）。hover（）{
alert（'message'）;
}
}
code>
< pre $ $（document）.ready（function（）{
if（$（＃button1）。lengt （$（$$））
$（＃button1）。click（function（）{'
// do something
}）
} else if（$（ #mytextfield）。length> 0）{
$（＃mytextfield）。hover（）{
alert（'message'）;
}
}
//代表自己
mCanvas = $（＃jsonCanvas）;
mMyPicture = new myPicture（mCanvas）;
例如：在 script.js 中有两个函数（外面domready）即。 onPage1Load（）和 onPage2Load（）。
page1.php 中有一个 $（document）.ready（onPage1Load）
等等为其他网页。这将确保意外的事件处理程序未注册。 <!DOCTYPE html>
<html>
<head>
<script src="script.js"></script>
</head>
<body>
...
include $content;
..
</body>
</html>
$(document).ready(function() {
if (window.location.pathname == '/info.php') {
$("#button1").click(function(){'
//do something
})
}else if(window.location.pathname == '/alert.php'){
$("#mytextfield").hover(){
alert('message');
}
}
$(document).ready(function() {
if ($("#button1").length > 0) {
$("#button1").click(function(){'
//do something
})
}else if ($("#mytextfield").length > 0){
$("#mytextfield").hover(){
alert('message');
}
}
//stands for itself
mCanvas = $("#jsonCanvas");
mMyPicture = new myPicture (mCanvas);
script.js you have two functions (outside domready) viz. onPage1Load() and onPage2Load().page1.php you have a $(document).ready(onPage1Load)
and so on for other pages. This will make sure that unintended event handlers are not registered.
