Bdtjtk

I have a Click-handler defined which handles clicks on an LI menu item. Suppose the code highlights the active item.

$('.menu li').click(function () {

   $(this).siblings().removeClass('active');

   $(this).addClass('active');   

   // etc.

}

On startup, I also simulate a click by calling this handler manually. This is required to highlight an item coming from a server-side URL, which will populate hidden fields. The LI Items have ID's so I manually invoke .click() on them.

$('document').ready(function () {

      if($("#queueFilter").val() == "MENU1") {

            $("#menu1").click();

      } else if($("#queueFilter").val() == "MENU2") {

            $("#menu2").click();

      } else {

            $("#menu3").click();

      }   

}

Problem: I need to distinguish the simulated startup click() invocation from the real user-initiated one. I thought of passing a custom param somehow, but it's not working. Is it possible to specify a custom handler param, which will be NULL in the other case?

Ideally what I want is, on startup:

$("#menu1").click(false); // Indicates a simulated click

Then in the handler definition:

$('.menu li').click(customarg, function () { .. }));

A custom arg would allow me to distinguish in my handler code where I'm coming from and proceed accordingly.

You can use the .trigger method from jQuery. It allows to send some parameters to the event handler.

Take a look here: http://api.jquery.com/trigger/

It would be like this : $('.menu li').trigger('click', { key: value })

Which version of jQuery are you using?

According to the jQuery API documentation you can pass any data you wish to .click() starting from 1.4.3.

The implementation would look something like this:

$('document').ready(function () {

      if($("#queueFilter").val() == "MENU1") {

            $("#menu1").click({isSimulated: true}, handleMenuClick);

      } else if($("#queueFilter").val() == "MENU2") {

            $("#menu2").click({isSimulated: true}, handleMenuClick);

      } else {

            $("#menu3").click({isSimulated: true}, handleMenuClick);

      }

}



function handleMenuClick(event){

    let clickedItem = $(event.target);

    console.log(clickedItem);



    if (!!event.data && event.data.isSimulated === true) {

        console.log("Simulated click");

    } else {

        console.log("Real click");

    }



    clickedItem.siblings().removeClass('active');

    clickedItem.addClass('active');

};

I just found the solution: use trigger() and .on() as follows,

Call the click as

$("#menu1").trigger('click', false);

and the handler definition is

$('.menu li').on('click', function (e, actualUserClick) {
...
});

In the case where the arg isn't passed (real user click) this arg is undefined.