Question

您好我正在使用库中提供的Jquery mobile splitview：http：//github.com/asyraf9/jquery-mobile/。

我在左侧A和B面板中有两个页面，右侧面板中有两个页面C和D. 最初我分别在左右面板中渲染页面A和C.现在点击链接我要将左侧面板从A更改为B，右侧面板C更改为D

更改无法正常工作，只更改左侧面板而非右侧面板中放置上述锚点的页面。

请注意，上面的链接或按钮始终显示在右侧窗格中。如果我使用

Answer 1

在链接点击/在splitview中触发更改的任何内容后执行.refresh（）。

Answer 2

splitview中有一个上下文加载选项。为什么不用这个？

我再也找不到样本页了，但是我在脚本中使用了相同的逻辑，所以...如果找不到它，请尝试这样的事情：

1）给出你的链接上下文属性：

<a href="#some" data-panel="menu" data-context="#otherPage" data-context-panel="main">click me</a>

2）听取这些上下文链接的点击，如下所示：

$(document).bind( "click", function( event ) {
  console.log("click registered");
  var link = $( self.findClosestLink(event.target) );

  if ( !link || event.which > 1) {
     return;
     }

  console.log( link );
  console.log( link.jqmData('context') );

  // context routine fires with context links
  if ( link.length === 1 && link.jqmData('context') ) {
     // fire your context function, RENAME THIS
     console.log("firing context routine");
     self.context( link );
     }

3）在某处放置一个上下文函数：

 context: function( object ) {

       var self = this,
           $context = object,
           $targetPanelID = $context.jqmData('context-panel');

       console.log("contextpage="+$context.href+"  contextPanel="+targetPanelID);

       // make sure the pageContainer is correctly set for the 2nd transition
       $.mobile.pageContainer = $('div:jqmData(panel="'+$targetPanelID+'")');

       // context changePage
       $.mobile.changePage( $( $context.jqmData('context') ), { transition:'slide', changeHash:true, fromHashChange: false, pageContainer: $.mobile.pageContainer });
       };

4）添加JQM findclosestLink函数（我忘了）

  findClosestLink: function (ele) {
     var self = this;
     while (ele){
     if (ele.nodeName.toLowerCase() == "a"){
        break;
        }
    ele = ele.parentNode;
    return ele;
    }

您的链接将触发第一个changePage，您的上下文函数将触发第二个changePage。根据你使用它的位置，你的上下文changePage调用也会触发另一个hashChange事件，JQM可能不会阻塞（每个changePage也会触发一个hashQhange，它被JQM使用 ignoreNextHashChange 阻止 - 检查源代码）。

因此，在进行第二次调用以确保hashChange被阻止后，您可能需要执行类似的操作：

  $.mobile.ignoreNextHashChange = true;

整个事情都在我的multiview插件中工作，但插件没有完成，错误，我最近没有时间处理它。上下文正在工作，所以您可以将其拉出来并根据需要使用它。

干杯！

Jquery mobile splitview $ .mobile.changePage无效

2 个答案: