Overriding jQuery.mobile-1.1.0.js

Question

I'm having a hard time with overriding a core jQuerymobile function. Here's the link to JQM library Im using: http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.js

I changed line 5873

.appendTo( wrapper )

to following code:

.appendTo( *My own code*  )

But I'm aware that changing the code directly inside JQM library isnt the best way to achieve what I need. So I would like to make an override in a custom js file. How would I do it, in order to override the least of the JQM lib code? Thanks in advance.

Answer 1

That code is found within a delegated event handler, so you could overwrite that event handler with your own from an external file.

Lines 5788 to 5884 (with most of the code redacted):

$( document ).delegate( ":jqmData(role='listview')", "listviewcreate", function() {
    ...
        .appendTo( wrapper )
    ...
});

So in your external JS code you can remove this event handler and attach your own:

$(document).undelegate(":jqmData(role='listview')", "listviewcreate").delegate(":jqmData(role='listview')", "listviewcreate", function () {
    //your version of the above code here
});

Note that .delegate() and .undelegate() should be replaced with .on()/.off() if you're using jQuery 1.7 or newer.