0

I have a responsive PHP website that I'm trying to incorporate some scripting into. Currently all functionality works well in PCs using:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>     

The problem I'm having is that some functionality doesn't work in iOS devices. For these to work I need to use:

<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jquerymobile/1.4.2/jquery.mobile.min.css" />
    <script src="//ajax.googleapis.com/ajax/libs/jquerymobile/1.4.2/jquery.mobile.min.js">/script>

However, adding all of the references together causes several problems through the site (especially in PCs):

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
 <link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jquerymobile/1.4.2/jquery.mobile.min.css" />
    <script src="//ajax.googleapis.com/ajax/libs/jquerymobile/1.4.2/jquery.mobile.min.js">/script>

The site is already designed to respond to all device resolutions/orientations. Note this is a PHP site. What is the recommended and most efficient way to structure the references so only PCs get the jquery script and mobile devices the rest? I found a post about using $_SERVER['HTTP_USER_AGENT'] and then including just the non-mobile portion of the jquery script for PCs with PHP code, but wanted to hear pros/cons from people with experience on what would be a good solution

Here is a sample problem I'm getting if I include both PC and mobile jquery references. Click here to see the test page live tampary.com/test.php?c_id=15&p_id=0&f_id=1&l_id=2. It's a form submit that when posted it's duplicating the input button. If I remove the jquery mobile problem is gone. After you click on the link, click back in your browser and you will see the replication. Happens in Chrome and Firefox at least.

  • Build a responsive site without jQuery Mobile, or [redirect users based on an attempt to detect mobile devices](http://stackoverflow.com/questions/3514784/what-is-the-best-way-to-detect-a-handheld-device-in-jquery). Without knowing what functionality you need jQuery Mobile for, no one here can suggest a better solution. – Blazemonger Jun 20 '14 at 21:20
  • What issues are you trying to solve with jQuery mobile? jQuery Mobile is a UI framework that works alongside jQuery, not a replacement for jQuery. If your jQuery Mobile site doesn't work on desktops then it's not designed properly. – nullability Jun 20 '14 at 21:22
  • I would simply use a library (http://mobiledetect.net/) and have it include the portion of code that works when on mobile(regardless of the operating sys) and hide that portion if it's not a mobile device – Brian Putt Jun 20 '14 at 21:23
  • Here is a sample problem I'm getting. Click here to see the test page live http://tampary.com/test.php?c_id=15&p_id=0&f_id=1&l_id=2. It's a form submit that when posted it's duplicating the input button. If I remove the jquery mobile problem is gone. After you click on the link, click back in your browser and you will see the replication. Happens in Chrome and Firefox at least. – user3662328 Jun 20 '14 at 22:18

0 Answers0