Question

我在这里看到了很多类似的问题，但没有完全像我所经历的那样。

我的网站上有一个简单的联系页面，适用于桌面版本但是当我使用jQuery mobile设置移动版本时，它只会在页面发布时返回undefined。

下面是php后面的表单。

<html>
<head>
<title>John's Website | Contact Me</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script type="text/javascript" src="../js/jquery.js"></script>
<script type="text/javascript" src="../js/jquery.mobile-1.1.0.min.js"></script>
<script type="text/javascript" src="../js/menu.js"></script>
<LINK REL="SHORTCUT ICON" HREF="../favicon.ico"> 
</head>
<body>
<div data-role="page">
<h2>Fill out the form below to contact me.</h2>
<form action="contact.php" method="post">
<label for="firstName">First Name:</label>
<input type="text" id="firstName" name="firstName" size="40" /><br />
<label for="lastName">Last Name:</label>
<input type="text" id="lastName" name="lastName" size="40" /><br />
<label for="userEmail">Your Email:</label>
<input type="text" id="userEmail" name="userEmail" size="40" /><br />
<label for="message">Message:</label>
<textarea id="message" name="message" cols="30" rows="5"></textarea><br />
<input data-role="none" type="submit" value="Submit"></input>
<input data-role="none" type="reset" value="Reset"></input>
</form> 
</div>
</body>
</html>

和PHP

<?php
$host="localhost"; // Host name 
$username="Idont"; // Mysql username 
$password="thinkso"; // Mysql password 
$db_name="john"; // Database name 
$tbl_name="contact"; // Table name

//connect
mysql_connect("$host", "$username", "$password")or die("cannot connect"); 
mysql_select_db("$db_name")or die("cannot select DB");

//gather vars and sanitize input
$first_name = htmlentities($_POST['firstName']);
$last_name = htmlentities($_POST['lastName']);
$email = htmlentities($_POST['userEmail']);
$message = htmlentities($_POST['message']);
$date_stamp = date("Y-m-d h:i:s");

$first_name = mysql_real_escape_string($_POST['firstName']);
$last_name = mysql_real_escape_string($_POST['lastName']);
$email = mysql_real_escape_string($_POST['userEmail']);
$message = mysql_real_escape_string($_POST['message']);


if(empty($_POST['firstName']) && empty($_POST['lastName']) &&
empty($_POST['userEmail']) && empty($_POST['message'])){
echo 'You did not fill out all fields. Please go back and enter all info.';
}

//write contents to db.
$sql = "INSERT INTO $tbl_name (firstName, lastName, email, date, message) 
VALUES ('$first_name', '$last_name', '$email', '$date_stamp', '$message')";

if(mysql_query($sql)){
$content = "Your message has been sent. /n Click <a href="index.php">here</a> to go
back to the home page.";
} else {
$content = mysql_error() . $date_stamp . 'Unable to send your message. Try again
later.';
}
?>

<html>
<head>
<title>John's Website | Contact Me</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script type="text/javascript" src="../js/jquery.js"></script>
<script type="text/javascript" src="../js/jquery.mobile-1.1.0.min.js"></script>
<LINK href="../js/jquery.mobile-1.1.0.min.css" rel="stylesheet" type="text/css">
<LINK REL="SHORTCUT ICON" HREF="../favicon.ico"> 
</head>
<body>
<div data-role="page">

<div data-role="header">its loaded</div>
<div data-role="content"><?php echo $content; ?></div>
</div>
</body>
</html>

我计划使用PDO和更多OO样式重新编写代码，但页面应该可以正常工作。这是我第一次使用JQM，所以我觉得我因为这个原因缺少了一些东西。

Answer 1

我试过这个并且它有效。我添加了一个target =“_ blank”，它会在新窗口中弹出，我不再收到未定义的错误。这就是我的代码的样子，它适用于Chrome for Android。它需要一个新窗口来显示PHP脚本生成的HTML，包括错误代码。

<form name="contactform" method="post" action="http://myphpcontactform.php" target="_blank">

Answer 2

我为页面加载关闭了AJAX功能，现在就像我怀疑的那样。这是另一个原因，但这现在适用。我确实失去了光滑的过渡效果，但很好。

只需将它贴在每个页面上

$(document).bind("mobileinit", function(){
        $.mobile.ajaxenabled = false;
    });

Answer 3

首先检查$ _POST但是你也执行SQL，没有条件要么停止执行，要么就是

这就是你所拥有的：

if( empty($_POST['firstName']) && 
    empty($_POST['lastName']) &&
    empty($_POST['userEmail']) && 
    empty($_POST['message'])) {
    echo 'You did not fill out all fields. Please go back and enter all info.';
}
// continue to execute the script ( SQL Below )

这是一个建议：

if( empty($_POST['firstName']) && 
    empty($_POST['lastName']) &&
    empty($_POST['userEmail']) && 
    empty($_POST['message'])) {

    // use $content instead of echo
    $content = 'You did not fill out all fields. Please go back and enter all info.';
}
// Add else condition here
else {
    //write contents to db.
    $sql = "INSERT INTO $tbl_name (firstName, lastName, email, date, message) 
    VALUES ('$first_name', '$last_name', '$email', '$date_stamp', '$message')";

    if(mysql_query($sql)) {
        $content = "Your message has been sent. /n Click <a href="index.php">here</a> to go
back to the home page.";
    } else {
        $content = mysql_error() . $date_stamp . 'Unable to send your message. Try again
later.';
    }
}

您可以进行其他优化，但希望这可以解决您的问题。

此外，您可以使用此Chrome插件来模仿移动设备：

https://chrome.google.com/webstore/detail/ljfpjnehmoiabkefmnjegmpdddgcdnpo

然后打开Chrome开发者工具并启动调试乐趣！

jQuery Mobile PHP表单帖子返回undefined

3 个答案: