0

好吧，我有一个类似的问题，但想扩展它，看看我是否能得到更好的答案：

我正在尝试对在表中存储电子邮件地址的 PHP 文件进行 Jquery Ajax Post 调用。成功的 ajax 调用后，我正在尝试更改按钮 html。

这是我的全部 HTML/Javascript：

<!DOCTYPE html>
<html>
    <head>

        <!--Meta tags-->
        <meta charset="utf-8">

        <!--Title-->
        <title>Startup Winnipeg</title>

        <!--Stylesheets-->
        <link rel="stylesheet" href="css/master.css">

        <!--Script-->
        <script type="text/javascript">

            function empty() {
                document.getElementById("email").value="";
            }

            function determine() {
                if (document.getElementById("email").value.length==0){
                    document.getElementById("email").value="Email Address";
                }
            }

            function validate() {
                document.getElementById("registerform").submit();
            }

        </script>

    </head>
    <body>
        <div id="container"></div>
        <div id="topbar"></div>
        <div id="header"></div>
        <div id="register">
            <div id="formcontainer">
                <form action="" id="registerform" name="registerform" method="post" >
                    <input type="text" id="email" name="email" value="Email Address" onClick="empty()" onBlur="determine()" />
                    <button type="submit" id="join" name="join" onClick="validate()">Sign Up</button>
                </form>
            </div>
            <div id="info">
                <a href="http://www.facebook.com" target="_blank"><div id="fb"></div></a>
            </div>
            <div id="bar"></div>
        </div>

        <!--jQuery-->
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

        <script type="text/javascript">

            //listen for click
            $('form').on('submit', function(e) {
                $.post('register.php', $("#registerform").serialize(), function() {
                    $('#join').html("Success!")             
                });        
                //disable default action
                e.preventDefault();
            });
        </script>
    </body>
</html>

这是将电子邮件地址写入表的 PHP 文件：

<?php include("database_connection.php");?>

<?php 

$email = $_POST['email'];
$email = mysql_real_escape_string($email);

mysql_select_db("suw",$con);

$sql="INSERT INTO emails (email) VALUES ('$email')";

mysql_query($sql,$con);

echo mysql_error();

 ?>

 <?php include ("close_database_connection.php");?>

我有几个问题：

  1. 如果我输入完整的电子邮件地址，它不会写入表格，但是，任何其他乱码都会写入表格

  2. 将数据写入表时，按钮的 html 不会更改

让我知道我做错了什么 - 我有两本书并且已经搜索了 jquery api，但我无法弄清楚我做错了什么。

4

1 回答 1

4

不确定它是否会有所帮助，但首先要摆脱所有内联 JS，以及相同事件的多个函数等。

将 javascript 放在头部，并删除内联处理程序：

<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script type="text/javascript">
      $(function() {
        $("#email").on({
            click: function() {
                this.value = "";
            },
            blur: function() {
                if (this.value.length===0) this.value = "Email Address";
            }
        });

        $("#join").on('click', function(e) {
            e.preventDefault();
            $.post('register.php', $("#registerform").serialize(), function(data) {
                $('#join').html(data)             
            });
        });
      });
    </script>
</head>
<body>
    <form action="" id="registerform" name="registerform" method="post" >
         <input type="text" id="email" name="email" value="Email Address" />
         <button type="submit" id="join" name="join">Sign Up</button>
    </form>
</body>

在您的 PHP 中，包含可能在标签内，并且只返回成功或错误：

<?php 
    include("database_connection.php");

    mysql_select_db("suw",$con);
    $email = mysql_real_escape_string($_POST['email']);
    $sql="INSERT INTO emails (email) VALUES ('$email')";
    mysql_query($sql,$con);
    if (mysql_errno()) {
        echo mysql_error(); // or just "error"
    }else{
        echo "Success!";
    }

    include ("close_database_connection.php");
?>
于 2012-05-30T23:05:16.420 回答