Home/ Questions/Q 7587225
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-30T19:37:12+00:00

I was wondering what would be the best way to execute a java-script code

  • 0

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:

  <!DOCTYPE html>
  <html>
   <head>
    <script src="script.js"></script>
   </head>
   <body>
    ...
    include $content;
    ..
   </body>
</html>

content ‘info’ contains a button, we want something to happen on click, content ‘alert’ should give us a message when you hover a text field.

What is the best way to trigger these actions, without running into an error, because the object is not found?

Option one: using window.location.pathname

 $(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');
           }
    }

Option two: checking if elements exist

$(document).ready(function() {
  if ($("#button1").length > 0) {
      $("#button1").click(function(){
        //do something
      })
  }else if ($("#mytextfield").length > 0){
       $("#mytextfield").hover(){
         alert('message');
       }
}

Option three: include the script in the loaded template

//stands for itself

Is there 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:

    mCanvas = $("#jsonCanvas");
    mMyPicture = new myPicture (mCanvas);

where the myPicture constructor get’s the context of the canvas element, and throws an error, if mCanvas is undefined.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    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 script.js you have two functions (outside domready) viz. onPage1Load() and onPage2Load().

    While in your 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.

    • 0