Jquery Mobile，带2套页面

Question

我有一个wordpress网站，需要使用swipe显示页面，我选择使用Jquery Mobile，我让它工作得很好。现在，我们在网站上有两种语言，使用wpml插件。而且我的滑动代码运行良好，除了当我们使用更改语言按钮滑动失败。

问题的详细信息。

我们只有3个文本在我们的网站页面，在2种语言。在页脚中，我们有改变语言的链接。另外，客户讨厌加载Ajax页面，所以我用data-role=page创建了三个Div，并将data-next，data-prev作为#div-$postid。所以导航器工作得非常好。我把data-role=page的页脚放在外面了。

现在，当我单击footer中的change按钮时，它会加载我使用Fiddler看到的英文页面，然后从服务器获取第一个data-role=page并替换其内容/slide。但是，因为它只选择第一个数据角色，所以所有其他英文页面都不会进入HTML，它只是更新DOM，而不是导航到英文版本。所以swipe失败了，因为其他英文页面不在dom中。

此外，页脚没有改变，所以我想要的是:我们可以简单地强制一个链接导航，而不是滑动的方式？Jquery Mobile强制在所有A标签上滑动，我不希望滑动到data-role=page之外的任何东西。

希望我说的有道理。

编辑此处是代码:不确定此代码是否会有所帮助

<?php 
    get_header(); 
global $post;   
$args = array('post_type' => 'mobile_slide','showposts' => '-1', "order" => "DESC");

$the_query = new WP_Query($args);            
if($the_query->have_posts()){
    while($the_query->have_posts()) { $the_query->the_post();
    $prev =get_previous_post();
    $next =get_next_post();
    if($prev) {
        $prev = "#page-" . $prev->ID; //get_permalink($prev->ID);
    } else {
        $prev='';
    }
    if($next) {
        $next = "#page-".$next->ID; //get_permalink($next->ID);
    } else {
        $next='';
    }

    if (has_post_thumbnail( $post->ID ) ) {     
        $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'slider_image' ); ?>
        <div id="page-<?php echo $post->ID; ?>" data-dom-cache="true"  data-transition="slide"  class="page" data-role="page" data-prev="<?php echo $prev; ?>" data-next="<?php echo $next; ?>" style="background-image:url('<?php echo $image[0]; ?>'); background-position:center center; background-color:#000; background-repeat:no-repeat; ">
        <?php } else { ?>
        <div id="page-<?php echo $post->ID; ?>" data-dom-cache="true"  data-transition="slide" class="page" data-role="page" data-prev="<?php echo $prev; ?>" data-next="<?php echo $next; ?>"> 
        <?php } ?>
        <div class="post_box">
            <h2><blockquote><?php the_title(); ?></blockquote></h2>
            <div class="post_entry">
               <?php the_content(); ?>
            </div>
        </div><!-- post_box -->
        </div>

   <?php   } 
   } ?>
   <?php get_footer(); ?>

这就是我所拥有的，除了get_footer使用基于Ul li的列表，其中的LI根据语言变量而变化，以显示两种语言的不同图像。

Answer 1

要阻止Ajax加载页面/链接，请添加到链接锚data-rel="external"或data-ajax="false"。这将正常加载页面，没有任何转换。

参考：

Answer 2

对于那些有类似问题的人，我使用以下命令来解决它：

1)我向A标记添加了一个"noswipe“类，这样我就可以在Jquery中引用它了

2)我添加了以下代码

$(function(){
  $(".noswipe").click(function(){
     window.location.href= $(this).attr("href");
      return false;
   });
 }); 

上面的代码只是强制跳过手机的解析和调用，适用于我的情况。