How to load external html content into a div inside a page using jquery mobile
Question
A part of mark up for the current page.
<div class="que-plc">
<div class = "questionHolder">
<div class = "questionBorder">
<h3>A question?</h3>
<div>
<div ><a id="goto-que1" class="to-next-que">NEXT</a></div>
</div>
</div>
</div>
</div>
The mark up that has to be loaded into the current page:
HTML -- que1.html:
<div class = "questionHolder">
<div class = "questionBorder">
<h3>Question Here?</h3>
<div data-type="horizontal">
<div><a id="goto-que2" data-role="button" class="to-next-que">NEXT</a></div>
</div>
</div>
</div>
HTML -- que2.html:
<div class = "questionHolder">
<div class = "questionBorder">
<h3>Question Here?</h3>
<div data-type="horizontal">
<div><a id="goto-que3" data-role="button" class="to-next-que">NEXT</a></div>
</div>
</div>
</div>
The javascript to load que1.html and que2.html:
$("a.to-next-que").click(function(){
alert(this.id)
var cur_id = this.id.toString();
$(".questionHolder").remove();
var last = cur_id.length
cur_id = cur_id[last - 1];
$.get('level/level1/que'+cur_id+'.html',function(question) {
$('.que-plc').html(question).trigger('create');
});
});
The problem is after que1.html is loaded into the dom i,e inside the . que-plc container, then the successive clicks wont load que2.html, que3.html ... to the dom . What is happening?
I am using jquery-mobile 1.0.1 , so using $.mobile.loadPage, $.mobile.changePage results in a error.
And also navigating from page1.html to page2.html via a link whose data-ajax="false" wont load the javascript that is in page2.html
That is:
<body>
<div data-role="page">
</div>
<script src="play.js"></script>
The play.js wont be available in page2.html`. How can this be corrected?
1 answers
solution1
0
You can use like this
$('#div_content').load("page.html");
Load page when click button
$('#button').click(function(){
$('#div_content').load('html.page');
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.