jquery mobile破坏我的POST

我有一个HTML文件（index.html）包含HEAD部分和BODY部分。在BODy部分，我有一个POST操作指向一个php文件的表单。jquery mobile破坏我的POST

如果我将HEAD部分添加到jQueryMobile的CDN中，则POST停止工作。这怎么可能，以及如何避免这种情况？

所以我的头看起来像这样：

<head> 
    <title>My Mobile App</title> 
    <meta charset="utf-8" /> 
    <meta name="viewport" content="width=device-width, initial-scale=1 maximum-scale=1" /> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css"> 
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.min.js"></script> 
    <script type="text/javascript" src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script> 
    <meta name="apple-mobile-web-app-capable" content="yes" /> 
    <meta name="apple-mobile-web-app-status-bar-style" content="black" /> 
    <link rel="apple-touch-icon" href="images/icon57.png" /> 
    <link rel="apple-touch-icon" sizes="72x72" href="images/icon72.png" /> 
    <link rel="apple-touch-icon" sizes="114x114" href="images/icon114.png" /> 
    <link rel="apple-touch-startup-image" href="images/icon320.png" /> 
    <link rel="apple-touch-startup-image" sizes="768x1004" href="images/icon320.png" /> 
</head> 

** if I comment the jquery.mobile script line the POST works **

而且随着职位的机身看起来是这样的：

<body> 
    <div data-role="page" id="index"> 
       <header data-role="header" data-position="fixed"> 
        <h1>Mobile APP</h1> 
       </header> 
       <div data-role="content"> 
        <b>Login</b> 
        <form method="POST" action="prologin.php"> 
         Name: <input type="text" name="name"><br> 
         Password: <input type="password" name="pass"><br> 
         <input type="submit" value="Login" data-inline="true" data-icon="gear"> 
        </form> 
       </div> 

       <footer data-role="footer" data-position="fixed"> 
        <h1>bla bla</h1> 
       </footer> 
    </div> 
</body>

现在我的PHP文件prologin.php比较复杂，但对于调试目的，我减少到：

<?php 
echo 'name='.$_POST['name'].' and pass='.$_POST['pass']; 
?>

所以，当我使用jQuery.mobile脚本，点击结果th Ë登录按钮是一个未定义的页面，如果我查看页面源代码...它是空的，我的意思是它看起来像：

name= and pass=

，因此没有被张贴如果我评论与jQuery.mobile脚本行，结果表明它应该，我的意思是：

name=myusername and pass=mypassword

（当然名为myUsername，输入mypassword是在输入框中我输入值）我在做什么错？

相同的页面和代码在另一台服务器上工作得很好。但现在它不再工作了。什么可能是错的？原来的主机也是CENTOS系统，主要是相同的配置。在工作服务器上，我有PHP版本5.3.3，并在这一个（不工作）我有PHP版本5.1.6 如何使用jQuery的手机影响HTML POST的方式，它会停止工作？

我的意思是，我该如何解决它？

我会尝试更新我的PHP，但在此服务器上有其他应用程序依赖于此版本，我会避免更新。

来源

2013-07-23 user1137313

就在这个属性添加到您的窗体：

data-ajax="false"

这将防止jQuery Mobile的劫持表单提交逻辑。

你的形式应该是这样的：

<form method="POST" action="prologin.php" data-ajax="false">

来源

2013-07-23 19:26:45 Gajotres

谢谢。我不知道这个。它解决了我的问题。虽然这个问题只发生在一台服务器上，而不是另一台服务器上，这是很奇怪的。 – user1137313

只是一个笔记......再次莫名其妙......现在它在FORM中没有data-ajax =“false”。我认为我的php语法中存在current_date的问题。我的意思是我没有使用date（），而是相同函数的更新版本。我不明白这一点:(这是莫名其妙的，因为它不适用于简单的PHP，只回应POST。 – user1137313

你可以添加数据的Ajax =“假”到表单标签，但该关闭大部分放在第一位使用jQuery移动的很酷的功能。

我想出来解决这个问题的解决方案是使用'pagebeforechange'事件来查看所做的请求，并使用内置的'changePage'方法将任何获取请求更改为发布请求。

这是我正在做的一个例子。需要注意的是，在加载jquery移动库之前，所有这些代码都放在头部分中！

编辑：我从项目中删除了无关的代码部分，我正在使用它，它可能已经在这个过程中被打破。你可以在这里工作得很好代码的未编辑的版本，但你必须编辑出所有不相关的多余物品：

function load_mobile_resources()

我呼吁在头部上面的函数每一个移动页面，像这样的：

<?php 
load_modile_resources(); 
?>

的减少，可能断码低于：

<script type="text/javascript"> 

    $(function() { 



     // ============================================= 
     // ALL PAGES 
     // ============================================= 

     // -- pagebeforechange -- 
     $(document).on("pagebeforechange", function(event, data){ 
      if (typeof data.toPage === "string") {      
       // intercept a page change request 
       // can alter any aspect of this request, if needed     

       if ('options' in data) { 
        if ('type' in data.options && data.options.type == 'post') { 
         //console.log('type is already post -- NOT converting get to post (it probably just was)'); 
        }else{ 
         // intercept this get request and make it a post request with the avsession value injected 

         // This is an example of how you can exclude certain pages or paths from the get to post conversion 
         if(! (data.toPage.indexOf('resources/') == -1)){ 
          //console.log('this is a resources request -- NOT converting get to post'); 

         // Don't want to mess with the built in popup feature 
         }else if('role' in data.options && data.options.role == 'popup'){ 
          //console.log('this is a popup -- NOT converting get to post'); 

         // Don't want to mess with the built in handling after a popup is closed 
         }else if(data.options.changeHash == false && data.options.fromHashChange == true){ 
          //console.log('this is a popup being closed (or browser fwd/back) -- NOT converting get to post'); 

         }else{ 
          // -- ok we want to mess with this one ... 
          // -- stop the current process 
          // console.log('converting get request to a post'); 
          event.preventDefault(); 
          convert_get_to_post(data.toPage, false); 
         } 
        } 
       } 

      } 
     }); 

    }); // end function 


    function convert_get_to_post(urlStr, forceReload){ 
     postData = new Object; 
     var urlObj = $.mobile.path.parseUrl(urlStr); 

     // Note: I commented out, but didn't totally remove, examples of how you can ensure 
     //  that certain data is always passed around. Int his case it was a session 
     //  key called avsession 

     if(urlObj.search){ 
      // -- ensure any query string parameters are sent as post data 
      var dataStr = urlObj.search.toString(); 
      dataStr = dataStr.replace(/^\?/,''); 
      dataPairs = dataStr.split('&'); 
      //console.log('here is the dataPairs'); 
      //console.log(dataPairs); 
      //var avsessionFound=0; 
      for (x in dataPairs) { 
       dataPair = dataPairs[x]; 
       //console.log(dataPair); 
       var dataSet = dataPair.split('='); 
       //console.log('here is the dataSet'); 
       //console.log(dataSet); 
       postData[dataSet[0]]=dataSet[1]; 
       //if(dataSet[0]=='avsession'){ 
       // avsessionFound=1; 
        //console.log('avsession found: '+dataSet[1]); 
       //} 
      } 
      //if(avsessionFound==0){ 
       // inject the avsession value into the post data 
       //postData['avsession'] = $.jStorage.get('avsession', ''); 
      //} 
      //console.log('here is the postData'); 
      //console.log(postData); 

      // send this request as a post 
      $.mobile.changePage(urlObj.hrefNoSearch, {data: postData, type: 'post', reloadPage: forceReload}); 

     }else{ 
      // no query string to worry about jsut send this as a post with the avsession value injected 
      //postData['avsession'] = $.jStorage.get('avsession', ''); 
      $.mobile.changePage(urlObj.hrefNoSearch, {data: postData, type: 'post'}); 
     } 

    } 
</script>

来源

2013-07-23 19:44:53 Drew

我确实喜欢你说，但它不起作用设置data-ajax为false工程。知道使用这种数据ajax解决方案的影响和副作用，但它是唯一可行的 – user1137313

我砍掉了一些与我正在使用它的项目相关的其他东西，所以也许我在做的过程中破坏了某些东西对于任何使用此代码的人，我都会建议联合国对所有console.log内容发表评论，以便您能够看到发生了什么事情。我花了几天时间才将所有内容按照我需要的方式正常工作 – Drew

已编辑的答案包括在我的项目中工作的原始未编辑的代码。 – Drew

jquery mobile破坏我的POST

回答

相关问题