javascript - Rails text_field 默认值在点击时消失(并变暗)

Question

这些文本字段看起来很棒，并且在 Facebook 等 Web 2.0 网站上很常见。

基本上，您可以通过将标签放在文本字段内来节省空间，而不是给文本字段添加标签。通常，文本的颜色会稍微变暗，当用户在文本字段中单击时，默认值会消失，并且颜色会切换为黑色或常规颜色，以便用户可以输入文本。

到目前为止，这就是我创建它们的方式:

# DEFAULT_VALUE = "email address"

<%= f.text_field :email,
      :style => "color:#aaa;",
      :value => DEFAULT_VALUE,
      :onfocus => "if(this.getValue()=='#{DEFAULT_VALUE}'){this.clear();this.style.color = '#000';}",
      :onblur => "if(this.getValue()==''){this.setValue('#{DEFAULT_VALUE}');this.style.color = '#aaa';}" %> 

这基本上有效。但我注意到的一个问题是，如果您在该字段中键入内容并提交失败的表单，该表单将重新加载您在该字段中键入的内容(应该如此)，但文本会错误地变暗。如果您在浏览器上单击返回，也会发生这种情况。它会显示您输入的文本(不是默认值)，但文本颜色变暗。

是否有更简单的方法来执行此操作或解决上述问题的方法？谢谢!

Answer 1

对于较新版本的rails，你应该使用

text_field_tag 'search', nil, :placeholder => 'Enter search term...'

在此处查看 text_field_tag documentation