php - 使用 javascript、表单和 php 发布和提交问题

Question

我正在尝试创建一个验证电子邮件 javascript 并让它与表单和 PHP 一起工作。当然，有些问题...

1. 如您在我的表单中所见，我确实将“post”定义为方法。但我只能像获取方法一样检索数据。在我开始添加电子邮件验证脚本并采用代码之前，它一直在工作。

2. 如果电子邮件不正确，我会返回 false。难道不应该执行对 test.php 的请求(在操作中定义)吗？就像现在一样，即使我返回 false，也可以访问该页面。

3. 根据上述问题的答案，如果电子邮件验证正常，我是否需要从 Javascript 提交表单？

javascript:

function isValidEmail() {
    regExp = /^[a-zA-Z]+([_\.-]?[a-zA-Z0-9]+)*@[a-zA-Z0-9]+([\.-]?[a-zA-Z0-9]+)*(\.[a-zA-Z]{2,4})+$/;
 if(document.subscribe.email1.value.search(regExp) == -1){
          alert(document.subscribe.email1.value + " Incorrect email address");
    return false; 
    } 

//document.subscribeForm.submit();

return true; 
}

PHP:

<?php

echo $_POST['email1'];

$mysqli = mysqli_connect("localhost", "root", "", "test", "3306");

$result = mysqli_query($mysqli, "SELECT email, id, subscriber, subscribed_date FROM `user` u;");

while($row = mysqli_fetch_array($result, MYSQLI_ASSOC)){
foreach($row as $key => $value){

   echo "$key = $value<BR/>";
}
}

mysqli_free_result($result);
mysqli_close($mysqli);

?>

html:

<div id="subscribe">
  <form action="test.php" name="subscribe" method=post">
    <p id="formlabel">E-mail</p> <input type="text" name="email1">
    <br>
    <p id="formlabel">Repeat e-mail</p> <input type="text" name="email2"> <br/>
    <input type="submit" value="Subscribe" onclick="isValidEmail()">
  </form> 

Answer 1

<input type="submit" value="Subscribe" onclick="isValidEmail()">

这会执行 isValidEmail()然后丢弃结果。 onclick本身返回 undefined并且不会阻止提交。

你可以说 onclick="return isValidEmail()" .然而:

1. 将验证/提交内容放在 form onsubmit 上, 不是 input click ，以确保它始终被调用以提交所有类型的表单。

2. 最好避免使用内联事件处理程序。

3. 您错过了一个 "在你的表格中 method属性，这大概就是它默认返回 get 的原因.

所以:

<form id="subscribe" method="post" action="test.php">
    ...
</form>

<script type="text/javascript>
    document.getElementById('subscribe').onsubmit= function() {
        if (!this.elements.email1.value.match(/^[^@]+@[^@]+$/) {
            alert('Please enter an e-mail address');
            return false;
        }
        if (this.elements.email1.value!=this.elements.email2.value) {
            alert('E-mail addresses do not match');
            return false;
        }
        return true;
    } 
</script>

我用一个简单的正则表达式替换了正则表达式，因为您当前使用的表达式是伪造的，并且会拒绝许多 有效的电子邮件地址。将客户拒之门外，因为他们的电子邮件地址不符合您对电子邮件地址的看法。

使用正则表达式“验证”电子邮件地址正确 is absurdly difficult .最好只对上述明显格式错误的字符串进行简单检查。如果您确实需要检查电子邮件地址，则必须实际尝试向其发送邮件，或者至少尝试查找 MXer 地址的域名部分。

参见 this question供讨论。