如何停止提交输入中的空字段

时间:2012-07-12 19:56:20

标签: javascript mysql html

我使用MySQL和PHP使用订阅新闻字母脚本。当用户输入电子邮件并单击该按钮时,电子邮件将添加到数据库中。

问题是,在没有输入电子邮件的情况下单击按钮时,数据库正在使用空记录进行更新。如何停止提交空字段并强制用户输入电子邮件?

这是我的HTML:

<form id="myForm" action="update.php" method="post">
    <input type="hidden" name="action" value="update" />
    <input type="text" name="email" id="email" value="Enter your email here" onfocus="if (this.value == 'Enter your email here') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Enter your email here';}" onwebkitspeechchange="this.value = this.value.replace('Enter your email here','')"; style=" color:#999; font-size:1em;width:200px; font-style:italic; font-family:"Times  New Roman", Times, serif;"/>
    <input class="button" type="image" src="rss.png" />
 </form>

5 个答案:

答案 0 :(得分:2)

听起来像是在进行用户输入并将其插入数据库之前需要进行一些表单验证。你正在做的事情很危险。

为什么不使用其中一个插件:

http://www.queness.com/post/10104/powerful-javascript-form-validation-plugins

答案 1 :(得分:0)

这是一个关于使用jquery验证插件的有用教程:http://docs.jquery.com/Plugins/Validation

忽略他们示例中的样式并专注于核心方面。在您的情况下,最有用的一行是:

<input id="cemail" name="email" size="25"  class="required email" />

答案 2 :(得分:0)

粗略地说,你需要做类似的事情。

var form = $('#mtForm');

$('input').change(function(){
   if($((this).val() == ''){
       form.unbind('submit').submit(function(){
           return false;
       });
   }
   else{
       form.unbind('submit');
   }
})

答案 3 :(得分:0)

  1. 您应该将电子邮件字段的value属性更改为placeholder属性。可以从电子邮件输入代码中删除onfocusonwebkitspeechchangeonblur代码。
  2. 如果这是之后唯一的验证类型(下面是用jQuery编写的),你可以使用这样的方法检查一个空白字段。

    $(function(){
        $('#myForm').submit(function(e){
            if ($('#email').val().trim() == "") {
              // some sort of notification here
              e.preventDefault();
              return false;
            }
        });
    });
    

答案 4 :(得分:0)

理想情况下,您将验证客户端(javascript / JQuery)以及服务器端(php)上的表单。

为清楚起见,我将删除输入框中的内联代码以获取此信息:

<input type="text" name="email" id="email" value="Enter your email here" />

注意 - 您可以使用

placeholder='Enter your email here'

在输入框中显示提示。

使用HTML5进行客户端验证

使用电子邮件格式验证创建必填字段:

<input type="email" name="email" id="email" value="Enter your email here" required="required"/>

使用javascript / JQuery进行客户端验证 - example.js

JQuery的:

$('#email').bind('blur', function() {
    if (!validateEmail($(this).val()) {
        // Add errors to form or other logic such as disable submit
    }
});
function validateEmail($email) {
    var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
    return emailReg.test($email);
}

}

服务器端验证 - update.php

// Require the email
if (empty($_POST['email'])) {
    $error_message = 'You must enter an email!';
} else if (!filter_var($_POST['email'], FILTER_VALIDATE_EMAIL)) {
    $error_message = 'Invalid email format. Example: example@example.example';
} else { // If no errors, continue processing the form
    // process the form, enter email
}

仅HTML5将阻止提交表单,但只有更新的浏览器才支持HTML5。

希望这有用!