Textarea onfocus，使用 javascript 进行模糊处理

Question

我正在寻找一种使用 JavaScript 控制 textarea 的默认值、onfocus 和 onblur 的方法

（我知道：
- textarea 中的默认值为：<textarea name="text"> Default value </textarea>
- 有一些使用 html5 和 jQuery 的解决方案。但在这里我正在寻找一个纯 JavaScript 解决方案）

我可以将它应用于 textarea 吗？：

form name="form1" action="comprovar.php" method="post">
    <input type="text" name="name" value="name" 
        onfocus="if (this.value=='name') this.value = '';" 
        onblur="if (this.value=='') this.value = 'name';"   
    />
 </form>

我怎样才能在这里获得焦点和模糊？：

<textarea name="text">  Write here </textarea>

示例在这里：http://jsfiddle.net/sKvMa/

Answer 1

您可以在 textarea 上设置onfocus 和onblur，完全一样，就像您可以从输入中一样。看这个演示：http://jsfiddle.net/sKvMa/1/

<textarea name="text" 
    onfocus="if (this.value=='Write here') this.value = '';" 
    onblur="if (this.value=='') this.value = 'Write here';" >Write here</textarea>

Answer 2

您实际上可以完全不使用 JavaScript 来实现这一点，尽管它是 HTML5 的一个特性，因此它适用于现代浏览器。

<textarea name="text" placeholder="Write here"></textarea>

根据您使用占位符的目的，这可能适合您，因为实现和维护脚本解决方案要简单得多。

Answer 3

在新浏览器中，您可以使用placeholder 属性。 jsfiddle 对于不支持placeHolder的浏览器

    if( !'placeholder' in document.createElement("input") ){

        var input =  document.getElementsByTagName("input"),
            textArea = document.getElementsByTagName("textarea");
    for(var k = 0; k < input.length; k++){
         input[k].value= "name";
        input[k].onblur = function(){
            if(this.value == "") this.value = "name"
        }
        input[k].onfocus = function(){
            if(this.value == "name") this.value = ""
        }
    }
    for(var k = 0; k < textArea .length; k++){
          textArea [k].value= "name";
        textArea [k].onblur = function(){
            if(this.value == "") this.value = "name"
        }
        textArea [k].onfocus = function(){
            if(this.value == "name") this.value = ""
        }
    }
}
​​

Answer 4

或者你可以像这样从jQuery定位

var mytext = $("textarea[name='text']").val();

然后你可以比较文本

if (mytext == 'Write here')
  //do this
else
  //do that