【问题标题】:Html Textarea PlaceholderHtml 文本区域占位符
【发布时间】:2011-05-09 07:23:28
【问题描述】:

我有一个 textarea,当焦点对准时应该清空文本持有者,当焦点失焦时应该取回原始文本或保留焦点时写入的任何文本。

编辑:

我知道如何选择文本区域。 $("textarea").text();

当你点击 textarea 时,我不确定如何清除内容,然后在失焦时再次取回内容。

【问题讨论】:

  • 所以你有两个元素——'textarea'和'textholder'。 'textarea' 应该在获得焦点时获取并存储'textholder' 的内容,并在失去焦点时将相同的文本返回给'textholder'?
  • 那么您的实际问题是什么?你的问题出在哪里?
  • @guys 对不起,我的母语不是英语。

标签: jquery html input textarea


【解决方案1】:

只需添加占位符参数:

<input type="text" name="name" placeholder="input placeholder" />
<textarea name="comment" placeholder="textarea placeholder"></textarea>

【讨论】:

  • 占位符是 HTML5 属性,在 IE7 或 IE8 中不起作用。请注意,除非您有标签或使用基于 javascript 的解决方案,否则您的表单将在前面提到的浏览器中被破坏。
  • @siliconrockstar - 它在 IE9 中也不起作用。但是,有许多可用的placeholder attribute polyfills 将增加对旧浏览器的支持。这个解决方案在语义上更好。
  • @JA - 感谢您提供基于 javascript 的解决方案的链接。
【解决方案2】:

您似乎正在尝试在 textarea 中获取说明,然后如果您删除该值,您将再次获得说明。试试这个

<textarea id="a">Message</textarea>

var standard_message = $('#a').val();
$('#a').focus(
    function() {
        if ($(this).val() == standard_message)
            $(this).val("");
    }
);
$('#a').blur(
    function() {
        if ($(this).val() == "")
            $(this).val(standard_message);
    }
);

你可以看到它在工作here

【讨论】:

  • 非常感谢。正是我想要的。我试图了解使用 .focus 和 .blur 的功能,谢谢 cambraca
  • 对于原生 placeholder 属性的更完整的 polyfill/shim,查看这个伟大的项目:jamesallardice.github.io/Placeholders.js
猜你喜欢
  • 2021-10-31
  • 2015-06-05
  • 2011-06-28
  • 2015-10-25
  • 2012-02-06
  • 2013-07-07
  • 2017-10-03
  • 2013-04-21
  • 2013-10-06
相关资源
最近更新 更多