Question

我有一个简单的php和jquery联系表单（3个字段：name - email - message），其输入字段的编码如下：

<input type="text" name="contactName" id="contactName" value="<?php if(isset($_POST['contactName'])) echo $_POST['contactName'];?>" class="requiredField"/>

我希望这些字段具有默认值，而不是为空。与此同时，我不相信使用占位符属性，因为它不受普遍支持。

我发现这个jquery脚本可以很好地完成这项工作：

<script>
$(function() {
$( ".contact_form_field" )
.focus(function() {
var $this = $(this);
if (!$this.data('default')) {
$this.data('default', $this.val());
}
if ($this.val() == $this.data('default')) {
$this.val('')
.css('color', '#000');
}
})
.blur(function() {
var $this = $(this);
if ($this.val() == '') {
$(this).val($this.data('default'))
.css('color', '#666');
}
})
.css('color', '#666')
});
</script>

但是，要使其工作，我必须将字段的值属性更改为所需的占位符文本：

<input type="text" name="contactName" id="contactName" value="Name" class="requiredField"/>

这可以预见，如果有空字段，这似乎会干扰应阻止邮件发送的表单操作：

if(trim($_POST['contactName']) === '') {
    $hasError = true;
} else {
    $name = trim($_POST['contactName']);
}

我以为我只需将字符串更改为

if(trim($_POST['contactName']) === 'Name') { or

if(trim($_POST['contactName']) == 'Name') { or

但它似乎不起作用。即使字段保持不变，也会发送邮件（非空，因为显示“名称”文本）。

我无法理解我做错了什么，任何输入（对于双关语x_x）都会非常感激。

Answer 1

创建一个包含所有默认值的数组，并测试以查看提交的值是否为默认值的一部分

$defaultValue = array('', 'Name');
if(in_array(trim($_POST['contactName']), $defaultValue) {
    $hasError = true;
} else {
    $name = trim($_POST['contactName']);
}

Answer 2

占位符现在已经可以使用了。但是如果你仍然不相信它，你可以使用基于onfocus和onblur属性的旧解决方案。这是一个例子：

<input onfocus="if(this.value==='default value') this.value=''" onblur="if(this.value==='') this.value='default value'">

默认表单字段值与表单操作混乱

2 个答案: