1

大家好，我的文本区域的自定义占位符有问题，这是我的代码

http://goo.gl/rIqtns jsfiddle 链接

场景是我有一个内容 div 包含 textarea 和 div 占位符 我想要的是如果 textarea 为 null 并且焦点占位符可见但如果 textarea 不为 null 并且焦点占位符将不可见并且 textarea 是焦点...我需要将运行到 ie8 的纯 javascript 函数或 css 样式。

4

5 回答 5

1

适用于所有浏览器的 jQuery 修复：

HTML：

<input type="text" placeholder="Fill me …">

Javascript：

$('[placeholder]').focus(function() {
  var input = $(this);
  if (input.val() == input.attr('placeholder')) {
    input.val('');
    input.removeClass('placeholder');
  }
}).blur(function() {
  var input = $(this);
  if (input.val() == '' || input.val() == input.attr('placeholder')) {
    input.addClass('placeholder');
    input.val(input.attr('placeholder'));
  }
}).blur();

http://jsfiddle.net/u3gTL/

于 2013-11-08T13:37:33.697 回答
1

您可以尝试@JamieRead 解决方案。但是对于较旧的浏览器，这是解决方案，PS。这适用于新旧浏览器：

将此添加到您的头部：

<script>
    function unsetPlaceholder(textarea){
        if (textarea.value=='placeholdertext'){textarea.value='';};return false;
    }

    function setPlaceholder(textarea){
        if (textarea.value==''){textarea.value='placeholdertext';return false;}
    }
</script>

这对你的主体：

<textarea onfocus="unsetPlaceholder(this)"  onblur="setPlaceholder(this)">placeholdertext</textarea>

是的，用你的占位符替换所有出现的“placeholdertext”。

JSFIDDLE

于 2013-11-08T13:36:12.933 回答
0

您可以使用 HTML5 占位符属性placeholder="text"。

HTML：

 <textarea placeholder="text"></textarea>

提琴手。

您可以按照@asavchenko 的建议使用placeholder.js 库。

于 2013-11-08T13:29:00.850 回答
0

结合使用建议的 HTML5 占位符属性，我还建议使用https://github.com/mathiasbynens/jquery-placeholder作为之前建议的https://github.com/NV/placeholder.js/的polyfill不再维护。

于 2013-11-08T13:38:16.130 回答
0

您可以使用 placeholder.js 库：https ://github.com/NV/placeholder.js/ 适用于 IE>6

更新：纯 HTML 属性占位符是 HTML5 属性，在旧浏览器中不起作用...

于 2013-11-08T13:31:03.273 回答