jquery移动端与jquery页面不会加载提交视图的顺序

我对这个问题一直很挠头，最后决定解决这个问题。

我有一个显示视图的控制器。这个视图非常基础，只有一个输入和提交按钮。在单击submit时，URL更改为下一个被调用的视图，但是实际的视图没有加载到浏览器中。按f5可以纠正这个错误，但如果没有手动干预，视图将永远不会加载。

这似乎是jquery/jquery UI和jquery mobile的问题，而不是codeigniter。

这是我的第一个视图:

<html>
   <head>
      <title>
        Link Orders
      </title>
     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
     <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script> 
     <script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script>
   </head>
<body>
    <form action="/sales/order_linking_complete"  method="post">
      <input type="text" id="ordernumber" name="ordernumber" />      
      <input type="submit" value="Link Orders">
</form>
</body>
</html>

这里是控制器:

function order_linking_complete() 
  {
      $this->load->view('sales/link_order_summary');
  }

，这是第二个视图:

<?php
  echo "test";
?>
<script type="text/javascript">
alert('test');
</script>

如果我取下面两行

 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
 <script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script>

和交换

它然后工作，但我不知道为什么。任何解释。

问题是我在我完整的页眉中有以下内容:

 <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.css" />
 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
 <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script> 
 <script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script>
 <link rel="stylesheet" href="/css/sales.css" />

在这种情况下，如果我把jquery mobile放在顶部，就不会加载所有正确的格式和布局。

我怎样才能使它正确工作，希望我已经充分解释了这一点。如有需要，请询问更多信息。

要在jQuery Mobile中以正常的方式成功提交表单，您需要添加额外的属性 data-ajax="false" ，只有并且只有这样表单才会提交到另一个页面，否则它将使用ajax进行表单加载。

在你的例子中应该是:

<form action="/sales/order_linking_complete"  method="post" data-ajax="false>
    <input type="text" id="ordernumber" name="ordernumber" />      
    <input type="submit" value="Link Orders">
</form>

也不要使用jQuery Mobile，除非你打算充分利用它的潜力。与普通页面混用会出现问题。

相关内容

最新更新

热门标签：