Question

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

（我知道：
- 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

Textarea onfocus，onblur与javascript

4 个答案: