JQTouch and AJAX

Posted on 2011-05-10
Last Modified: 2012-05-11

I am quite new to jqtouch but I am trying to integrate it with an existing website.

I have set up a single html page, however I want the links to go grab content from different pages on the existing website. I decided the easiest way to do this would be using AJAX. I set up a <div> on the single page for each of the other pages i.e.

<div id="home"></div>
<div id="about"></div>
<div id="content"></div>

I then have the following  which loads the content from the pages in to the single page divs:
        $('#home').load('' + ' #content');
        $('#about').load('' + ' #content' );
        $('#content').load(' + ' #content' );

The reason I have to do this is that my single html file is sat in a different directory to all other pages.

The above seems to work fine for what I want however my question is once the content is loaded I need to do something with any links that appear in the content as they do not work. Is there a way in ajax to change the reference of the links in the content and point them to the correct place as above?

Question by:Brandon2k1
    LVL 16

    Accepted Solution

    After you load the page can you call some jquery functions to find your links and change the attributes (link locations)
    LVL 1

    Author Comment

    Im pretty sure thats the correct way forward, Im just stuggling to actually make it happen!! I will keep reading to see if i  can grasp it, but if you had an example of how you see it working that would be great.

    Any other comments welcome!
    LVL 16

    Expert Comment

    $('a').each(function() {
          $(this).attr("href", function(index, old) {
                return old.replace("find", "replace");
    LVL 1

    Author Closing Comment

    Sorry for the delay in getting back to you. You hit the nail on the head. Used a slightly different function to get the result but changing the attr had the desired effect.



    Write Comment

    Please enter a first name

    Please enter a last name

    We will never share this with anyone.

    Featured Post

    How to run any project with ease

    Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
    - Combine task lists, docs, spreadsheets, and chat in one
    - View and edit from mobile/offline
    - Cut down on emails

    Someone recently asked me about how to display a progress indicator on a page while an iframe is loading. And I remember when I first came across this myself. It was a bit tricky to get my head around, but really, it's very simple. The most impor…
    JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
    In this tutorial viewers will learn how to embed Flash content in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <object> tag to embed Flash content.: To specify that the object is Flash content, d…
    The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …

    759 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    11 Experts available now in Live!

    Get 1:1 Help Now