如何使用jQuery Mobile将外部HTML内容加载到页面内的div中

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: 加载que1.html和que2.html的javascript：

    $("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 . 问题出在que1.html被加载到dom i，e内部之后。 que-plc container, then the successive clicks wont load que2.html, que3.html ... to the dom . que-plc容器，则连续的点击不会将que2.html, que3.html ... to the dom加载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. 我正在使用jquery-mobile 1.0.1 ，所以使用$ .mobile.loadPage和$ .mobile.changePage会导致错误。

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 并通过a link whose data-ajax="false"不会加载page2.html的javascript a link whose data-ajax="false"从page1.html to page2.html导航page1.html to page2.html 。

That is: 那是：

<body>
<div data-role="page">
</div>
<script src="play.js"></script>

The play.js wont be available in page2.html`. play.js将wont be available in page2.html`中使用。 How can this be corrected? 如何纠正？

Answer 1

You can use like this 你可以这样使用

$('#div_content').load("page.html");

Load page when click button 单击按钮加载页面

$('#button').click(function(){   
    $('#div_content').load('html.page');
 });

如何使用jQuery Mobile将外部HTML内容加载到页面内的div中

问题描述

1 个解决方案

解决方案1
0

如何使用jQuery Mobile将外部HTML内容加载到页面内的div中

问题描述

1 个解决方案

解决方案1 0

解决方案1
0