Question

标记当前页面的一部分。

<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>

必须加载到当前页面的标记：

  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>

加载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');
    });
});

问题是在que1.html加载到。que-plc容器内的dom i之后，然后连续点击不会加载que2.html, que3.html ... to the dom。发生了什么事？

我正在使用jquery-mobile 1.0.1，因此使用$ .mobile.loadPage，$ .mobile.changePage会导致错误。

并且page1.html to page2.html通过a link whose data-ajax="false"导航不会加载page2.html

中的javascript

那是：

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

play.js wont be available in page2.html`。如何纠正？

Answer 1

你可以这样使用

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

点击按钮

时加载页面

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

如何使用jquery mobile将外部html内容加载到页面内的div中

1 个答案: