Question

In jQT AJAX demo(main/index.html), the link doesn't have #sign before it is loaded.

<a href="ajax.html">GET Example</a>

After loading, it becomes like below, replaced by the div id in ajax.html. And the loaded div, whose id is 'get', is appended to the page.

<a href="#get">GET Example</a>
...
<div id="get" >...</div>

I wonder how to remove&reload or replace the div as it did at the first time. There might be changes in that page, if it is dynamically generated one. Or is there any other method which does not append div, not change link to '#...' and just leave it as it was?

Was it helpful?

Solution

HTML :

<a href="#" class="get_btn">GET Example</a>
<div id="get"></div>

jQuery :

$('.get_btn').on('click',function(){
   $.ajax({
     url:'ajax.html',
     type:'GET',
     success:function(html){
       $('#get').html(html);
     }
   });
});

If you still want to use your HTML , so change $('.get_btn') to $('a[href="#get"]')

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top