javascript - 使用 Javascript 更改输入值

Question

标题看似简单，但我需要帮助。

我有一个表单，其中包含一个字段输入“email”，在用户填写之前，该字段的值为空。好的，点击提交按钮后，我调用了函数 validate()，它是:

function validate(){
    var email=document.getElementById("email");
    if(!(/[\w-\.]{3,15}@([\w-]{2,}\.)*([\w-]{2,}\.)[\w-]{2,4}/.test(email))) {
        email.setAttribute('value','Insert a correct email');
        email.style.border="2px solid red";
    } else {
        alert("Valid field"); // This is to test it works
        email.style.border="2px solid #63ce40";
        this.form.submit();
    }
    }

我想在这里做的是，如果插入的电子邮件不符合要求(无效)，则将输入的值更改为“插入正确的电子邮件”。

如果该字段为空并且我单击提交，它会完美运行，但如果我插入文本并单击提交，唯一的变化是该字段将获得 2px 红色边框，但文本没有变化。

我想知道我必须做什么，以便在我单击“提交”时写入的错误电子邮件被删除并替换为文本“插入正确的电子邮件”。

输入是:

<li>
    <input type="text" id="email" name="email" 
    value="" onfocus="this.value=''" size="40"/>
</li>

还有我正在使用的提交按钮:

<input id="bsubmit" type="button" value="Submit"
name="submit" onclick=";this.disabled=true;validate();
this.disabled=false;"/>

谢谢。

Answer 1

很高兴您尝试使用 setAttribute完全是因为这是一个重要的方法，但问题是您不想修改 value attribute 在这种情况下，它是 DOM 的一部分，但您想修改 <input>元素的 value 属性(property)。

email.value = 'Insert a correct email';

http://jsfiddle.net/XJZwm/