How to make jQuery Mobile only affect one page [duplicate]

StackOverflow https://stackoverflow.com/questions/23691145

  •  29-07-2023
  •  | 
  •  

Domanda

In the website that I am creating I use jQuery Mobile, which granted I don't know much about, and I'm having a big problem. In my website I only link to jQuery Mobile on one page, and I only want to use jQuery Mobile on one page (I don't know if that is possible, but that is what I want to do).

I have four main pages on my website: Homepage.php, SalesForms.php, Reports.php, and Login.php. I only want to use jQuery Mobile on the Reports.php page (I'm using it for its transitions to create a nice looking html form process).

Whenever I go to the Reports.php page it uses jQuery Mobile and jQuery and the jQuery Mobile CSS, which is good. But when I leave the Reports.php page and go to other pages, jQuery Mobile and its CSS is still being used, even when it isn't linked to on those page and when I don't want it to be used.

For example, when I visit Homepage.php it isn't using jQuery Mobile or its CSS, then I visit Reports.php which does use jQuery Mobile and its CSS, and then I visit Homepage.php again and it is still using jQuery Mobile and its CSS. This is a problem for me because jQuery Mobile's CSS is interfering with my CSS on pages other than the Reports.php page, which is the only page it is linked to on.

I want to know if and how I can make jQuery Mobile only be used on the Reports.php page so that if I go to another page after visiting the Reports.php page it doesn't use jQuery Mobile.

Here is my code where I link to jQuery Mobile (I only link to jQuery Mobile in my Reports.php page):

<head>
    <link rel="stylesheet" href="../css/jQuery.css">
    <link rel="stylesheet" href="../css/Main.css">
    <script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>
</head>

jQuery.css is just a modified version of jQuery's CSS so that it doesn't interfere with my CSS and Main.css is my CSS.

È stato utile?

Soluzione

I'm assuming you're not using mod_rewrite and your file reports.php is visible on the url.

Based on your comment: This is the output for $_SERVER["REQUEST_URI"]: 

string(47) "/~a7068104/2013-2014/Lab_13/Reports/Reports.php"

So, we're going to use stripos() to check if the user is requesting a page, that has "reports.php" in it! We are using the case insensitive function instead of strpos(), you can find more info at ( http://www.php.net/manual/en/function.stripos.php )

You can use the following condition / logic:

<?php if ( stripos($_SERVER['REQUEST_URI'], "reports.php") ) : ?>

    <!-- add the html specific to the REPORTS.PHP -->


<?php else: ?>

    <!-- add the html specific to NON REPORTS.PHP Pages -->

<?php endif; ?>

<!-- Remember, everything else GOES OUTSIDE THE PHP IF CLAUSE --->

The solution for your problem is:

    <link rel="stylesheet" href="../css/jQuery.css">
    <link rel="stylesheet" href="../css/Main.css">
    <?php if ( stripos($_SERVER['REQUEST_URI'], "reports.php") ) : ?>
    <script src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>
    <?php else: ?>
    <script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
    <?php endif; ?>

Hope this helps!

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top