javascript - .load() not working on ul li click -


here code

$(document).ready(function(){    $("#work").click(function(){      $("#container").load("about/work.html");    });    $("#profile").click(function(){      $("#container").load("profile.html");    });  });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <ul>    <li><a id="work" href="">work</a></li>    <li><a id="profile" href="">profile</a></li>  </ul>    <div id="container"></div>

when click on work or profile requested page flashes in container div , sometime stays in if run same script on button click loads page without problem. how can make work li ?

add event.preventdefault

$(document).ready(function(){   $("#work").click(function(event){     event.preventdefault(); //changed here     $("#container").load("about/work.html");   });   $("#profile").click(function(event){     event.preventdefault(); //changed here     $("#container").load("profile.html");   }); }); 

Comments

Popular posts from this blog

unity3d - Rotate an object to face an opposite direction -

angular - Is it possible to get native element for formControl? -

javascript - Why jQuery Select box change event is now working? -