1

我在表单中添加了一个必填选项，但除了电子邮件类型外，它似乎不起作用。

<input type="text" value="Your name" name="name" onblur="if (this.value == '') {this.value = 'Your name';}" onfocus="if (this.value == 'Your name') {this.value = '';}" required>
<input type="email" value="E-mail" name="email" onblur="if (this.value == '') {this.value = 'E-mail';}" onfocus="if (this.value == 'E-mail') {this.value = '';}" required>
<input type="tel" value="Phone number" name="phone" onblur="if (this.value == '') {this.value = 'Phone number';}" onfocus="if (this.value == 'Phone number') {this.value = '';}" required>
<input type="text" value="Your address" name="address" onblur="if (this.value == '') {this.value = 'Your address';}" onfocus="if (this.value == 'Your address') {this.value = '';}" required>                 
<input type="text" value="Coupon code" name="coupon" onblur="if (this.value == '') {this.value = 'Coupon code';}" onfocus="if (this.value == 'Coupon code') {this.value = '';}" required>
4

2 回答 2

1

因为你已经给了他们Value属性。尝试placeholder改用。

演示

<input type="text" placeholder="Your name" name="name" onblur="if (this.value == '') {this.value = 'Your name';}" onfocus="if (this.value == 'Your name') {this.value = '';}" required>
<input type="email" placeholder="E-mail" name="email" onblur="if (this.value == '') {this.value = 'E-mail';}" onfocus="if (this.value == 'E-mail') {this.value = '';}" required>
<input type="tel" placeholder="Phone number" name="phone" onblur="if (this.value == '') {this.value = 'Phone number';}" onfocus="if (this.value == 'Phone number') {this.value = '';}" required>
<input type="text" placeholder="Your address" name="address" onblur="if (this.value == '') {this.value = 'Your address';}" onfocus="if (this.value == 'Your address') {this.value = '';}" required>                 
<input type="text" placeholder="Coupon code" name="coupon" onblur="if (this.value == '') {this.value = 'Coupon code';}" onfocus="if (this.value == 'Coupon code') {this.value = '';}" required>

编辑：这仍然不能完美地工作，因为您将值设置在onblur. 我更新了小提琴，删除了 onblur 和 onfocus 事件。该功能默认由占位符提供。

<input type="text" placeholder="Your name" name="name" required>
<input type="email" placeholder="E-mail" name="email" required>
<input type="tel" placeholder="Phone number" name="phone" required>
<input type="text" placeholder="Your address" name="address" required>                 
<input type="text" placeholder="Coupon code" name="coupon" required>
于 2013-12-04T20:14:37.713 回答
0

因为onblur您正在通过javascript代码设置输入的值。

电子邮件正在工作，因为onblur设置的不是有效的电子邮件地址。

于 2013-12-04T20:12:11.213 回答