How to use jQuery Mobile and Backbone JS together

问题:

I've been enjoying using Backbone JS for a iPad HTML5 project... But I'm quickly running into a issue of needing iPad-ish transitions, form elements etc. After looking around, it seems jQuery Mobile is the most established. We use jQuery anyhow.

But one thing I quickly ran into was the hash events/ajax stuff of the two libraries quickly didn't work. Because jQuery Mobile takes care of loading in pages, and doing the transitions etc, it was not letting my Backbone Controller routes work as they did before. It seemed that the two aren't actually that compatible?

After some work though, I have a basic workaround... Using the page loading events stuff in jQuery Mobile to see the active page it's on and then fire the correct Backbone View that goes with that page. Basically doing away completely with Backbone's hash listening/routes/controller.

But this still doesn't seem right? How can Backbone JS and jQuery Mobile work seamlessly together? How do I do this right, moving forward?

回答1:

I think I found a solution when I asked the same question.

Disable the hash change controller in JQuery mobile UI and replace with backbone.js

There looks to be an option to disable JQuery hash change listening on a recent checking.

https://github.com/jquery/jquery-mobile/commit/3162428558efd9960739ef8f00a7ead0dbf6d3ec

I have not tried it yet though. If it works please let us know.

Brad

回答2:

It seems that the JQuery Mobile team has made a conscious decision to not support the sort of dynamic applications the Backbone.js targets. From the alpha 4 release notes:

After 1.0 is out, the project be focusing on ... dynamic applications, expanded widget set, and ... A more detailed roadmap is underway and we’ll share it as we get closer to our 1.0 release.

Further evidence for this is the removal of the autoInitialize option as they went from alpha 3 to alpha 4: issue 1391

So for now, we need workarounds. An alternative answer is to help fix outstanding JQM bugs and push it closer to 1.0, so we can get dynamic application features into JQM ASAP.

回答3:

i prefer something more integrated w/ jquery mobile, so i usually replace backbone's router with this one: github.com/azicchetti/jquerymobile-router . works nicely

回答4:

Found this and it worked perfectly for me: Redirect from mobile site (jQuery mobile) to main site styles linger

I was redirecting to the main site and it kept throwing "Backbone history started" errors