javascript - Loading external page content in specific division -


i want display external page contents in specific divisions. have found solutions iframes etc nothing helps me much.

<ul class="nav nav-pills">     <li class="active">         <a data-toggle="pill" href="#home">account details</a>     </li>     <li>             <a data-toggle="pill" href="#menu1">wish list</a>     </li>     <li>         <a data-toggle="pill" href="#menu2">edit account</a>     </li> </ul>  <div class="tab-content">     <div id="home" class="tab-pane fade in active">         ## want content of "/mtsite/page" ##     </div>     <div id="menu1" class="tab-pane fade">         ## want content of "/mtsite/page1" ##     </div>     <div id="menu2" class="tab-pane fade">         ## want content of "/mtsite/page2" ##     </div> </div> 

how can this?

approach html based on rorys' comment:

$("#home" ).load("/mtsite/page", function() {     console.log("loaded content home."); });  $( "#menu1" ).load("/mtsite/page1", function() {     console.log("loaded content menu1."); });  $("#menu2" ).load("/mtsite/page2", function() {     console.log("loaded content menu2."); }); 

if don't want log in console, can use:

$("#menu2" ).load("/mtsite/page2"); 

Comments

Popular posts from this blog

Ansible - ERROR! the field 'hosts' is required but was not set -

customize file_field button ruby on rails -

SoapUI on windows 10 - high DPI/4K scaling issue -