Variable function in jquery

Question

i am not really good in jquery. Is it possible, to put a variable operator to make a function work? Because of different versions of jQuery used on different Pages.

The .on-function came up in 1.7 but some sites are running with lower version and therefore i need to use the .click function instead. And i want to avoid duplicate code for each version.

For example :

$('#mySelector')(var <= 3.4) ? ".click(function()" : ".on('click', function()");

{
    $( "#dialog p span" ).remove(); 
    $( "#dialog p" ).append('<span>'+ isEncHTML(html_output) 
});

Thank you all for your help.

To make it more clear:

This works with 1.7 (includes the buttons - option:

$('.delete_league, .print_league').on('click', function() 
{
        $( "#dialog p" ).append('<span>'+wpslm_v_script_vars.delete_league+'</span>');
            $( "#dialog" ).dialog({ 
                modal: true, 
                buttons: 
                [{
                    text: "OK",
                    click: function() 
                    { 
                        $( "#dialog p span" ).remove();
                        $(this).dialog("close"); 
                    }
                }] 
            });
});

And this work with 1.6. If i keep the buttons-option, it throws an error.

    $('.delete_league, .print_league').click(function() 
{
    // Just in case there is an old message hanging around
    $( "#dialog p span" ).remove(); 
    $( "#dialog p" ).append('<span>'+ isEncHTML(wpslm_v_script_vars.delete_league) +'</span>');
    $( "#dialog" ).dialog({ 
        modal: true
    });
});

So, i want to make the selector-line(and the buttons-option) variable so that i can use the same code for both. Means, if i see that i am running an older version than 1.7 i ust eht .click without buttons otherwise i use .on with the buttons-option. I hope that is not too confusing now.

Your decision should be simply based on a single question: What is the lowest version I must support? The answer to that determines the jQuery library you end up using. In my personal opinion if you want to also write code for another application using later jQuery version not writing separate code pages is lazy-coding and will in the end cost you more time debugging than the time you would spend right now writing and maintaining separate code pages. Personally, I would try to make the time savings by simply writing for the lowest jQuery library. — Nope
– Nope, Commented Sep 22, 2012 at 20:21

Nope · Accepted Answer · 2012-09-22 19:50:01Z

1

i want to avoid duplicate code for each version.

If you want to write code compatible with 2 version of jQuery but you don't want to duplicate code you are better off to just write the code aiming at the lowest version your code will support.

For example, if the lowest is 1.6 then use bind for attaching events and delegate if you need to attach events to dynamically generated elements.
(click calls bind anyway in 1.6 so you might as well use bind)

Personally, I believe writing a single method to support multiple versions is a bad idea and will be hard to maintain and be insane to debug at occasions.

However, if you write 2 separate code files, targeting a specific version of jQuery, you can just include one or the other, depending on the application.

edited Sep 22, 2012 at 19:50

answered Sep 22, 2012 at 19:44

Nope

22.4k8 gold badges50 silver badges73 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

JSS Over a year ago

Thanks for your answer. yes, i could do this easily. But then i have to maintain 2 files. If possible, i want to avoid that.

Nope Over a year ago

@JSS: That's why I would simply write the code aiming at the lowest jQuery library you must support, that way you don't have to maintain separate code files or hack up your code everywhere.

prashanth · Accepted Answer · 2012-09-22 19:53:42Z

1

Instead of checking for jquery version, check if the function exists

if($.fn.on) {

}

answered Sep 22, 2012 at 19:53

prashanth

2,10912 silver badges13 bronze badges

1 Comment

JSS Over a year ago

ok, but that doen't keep me away from using a if-then-else for choosing the function.

Rune FS · Accepted Answer · 2012-09-22 20:02:16Z

0

just use .click in both cases. click is valid in jQuery 1.7

or you can do something like this

var setClick = function (selector,handler) {
      return $.fn.on ?
              function () {
                  $(selector).on('click',handler)
              } 
              : function () {
                   $(selector).click(handler);
              }
}

and the you can use it like

setClick("#mySelector",function () {
    $( "#dialog p span" ).remove(); 
    $( "#dialog p" ).append('<span>'+ isEncHTML(html_output) 
});

or you could add it the jQuery object

$.fn.setClick = function (handler) {
      return this.on ?
              function () {
                  this.on('click',handler)
              } 
              : function () {
                   this.click(handler);
              }
}

and then call it like below

$("#mySelector").setClick(function () {
    $( "#dialog p span" ).remove(); 
    $( "#dialog p" ).append('<span>'+ isEncHTML(html_output) 
});

but in all cases you end up with accomplishing nothing because all the above could have been accomplished wimply by using .click in the first place

edited Sep 22, 2012 at 20:02

answered Sep 22, 2012 at 19:31

Rune FS

21.7k7 gold badges65 silver badges101 bronze badges

7 Comments

JSS Over a year ago

thanks for your answer. I know that. But the .click doesnt support the button options from the ui-framework. And i want to use this: $( "#dialog" ).dialog({ modal: true, buttons: [{ text: "OK", click: function() { $( "#dialog p span" ).remove(); $(this).dialog("close"); } }] });

Felix Kling Over a year ago

@JSS: Could you please be more specific about this? What exactly are you trying to do?

JSS Over a year ago

@ Felix: I want, depending on a variable, choose whether i use the .on or the .click funtion. But onli in the first Line where the Selector is.

Felix Kling Over a year ago

@JSS: Yes, but why do you have to? How is this related to UI buttons? I'm just trying to find out whether you really have to do what you think you have to do and whether there is not another way. Your example does not include anything regarding jQuery UI so it's not easy to figure out what's going on.

Rune FS Over a year ago

@jss and how will you cope with the UI buttons in the case where you HAVE to use click in the first palce?

|

Collectives™ on Stack Overflow

Variable function in jquery

3 Answers 3

2 Comments

1 Comment

7 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

1 Comment

7 Comments

Your Answer

Sign up or log in

Post as a guest

Related