Use JQuery Ajax to load the static html page into a div tag

advertisements

I got this working but I need a default page showing before you choose one, how do I do this? Also is it possible to hide the page files? So it will not show when you View Source.

    <script src="http://code.jquery.com/jquery-1.4.min.js" type="text/javascript"></script>
<script type="text/javascript">
        $(document).ready(function(){
           $("#page1").click(function(){
            $('#result').load('latestmembers.php');
             //alert("Thanks for visiting!");
           }); 

           $("#page2").click(function(){
            $('#result').load('Females.php');
             //alert("Thanks for visiting!");
           });
         });
    </script>

<ul>
    <li><a id="page1" href="#">Latest Members</a></li>
    <li><a id="page2" href="#">female members</a></li>
 </ul>
<div id="result" style="clear:both;">
</div>

Default will load on load and then you can choose to see just latest members or female members.


$(document).ready(function(){
      $('#result').load('latestmembers.php'); // default page
       $("#page1").click(function(){
        $('#result').load('latestmembers.php');
         //alert("Thanks for visiting!");
       }); 

       $("#page2").click(function(){
        $('#result').load('Females.php');
         //alert("Thanks for visiting!");
       });
     });

JavaScript is client side code, you cannot hide anything from source code.