[英]Internet Explorer Placeholder For Textarea
My application is in need of placeholders for a text field and a textarea field. 我的应用程序需要文本字段和textarea字段的占位符。 I know Internet Explorer doesn't support placeholders. 我知道Internet Explorer不支持占位符。 I was looking around and I found some fallback code which is working great only for the text field. 我环顾四周,发现一些后备代码仅对文本字段有效。 How can I get this working for the textarea also. 我怎么也可以在textarea上使用它。
Code: 码:
jQuery(function() {
jQuery.support.placeholder = false;
test = document.createElement('input');
if('placeholder' in test) jQuery.support.placeholder = true;
});
$(function() {
if(!$.support.placeholder) {
var active = document.activeElement;
$('input[type=text], textarea').focus(function () {
if ($(this).attr('placeholder') != '' && $(this).val() == $(this).attr('placeholder')) {
$(this).val('').removeClass('hasPlaceholder');
}
}).blur(function () {
if ($(this).attr('placeholder') != '' && ($(this).val() == '' || $(this).val() == $(this).attr('placeholder'))) {
$(this).val($(this).attr('placeholder')).addClass('hasPlaceholder');
}
});
$('input[type="text"], textarea').blur();
$(active).focus();
$('form').submit(function () {
$(this).find('.hasPlaceholder').each(function() { $(this).val(''); });
});
}
});
HTML: HTML:
<li>
<input type="text" placeholder="To:" id="to" autocapitalize="off" autocorrect="off" autocomplete="off" />
</li>
<li>
<textarea placeholder="Message:" id="body" rows="10" cols="30" autocapitalize="off" autocorrect="off" autocomplete="off"></textarea>
</li>
Change $(':text')
to $('input[type="text"], textarea')
将$(':text')
更改$(':text')
$('input[type="text"], textarea')
Alternatively, this existing jQuery plugin: 或者,此现有的jQuery插件:
https://github.com/mathiasbynens/jquery-placeholder https://github.com/mathiasbynens/jquery-placeholder
works on textareas and many types of input fields, including password fields 适用于textareas和许多类型的输入字段,包括密码字段
<script type="text/javascript">
$(function() {
if(!$.support.placeholder) {
var active = document.activeElement;
$('input[type="text"], textarea').focus(function () {
if ($(this).attr('placeholder') != '' && $(this).val() == $(this).attr('placeholder')) {
$(this).val('').removeClass('hasPlaceholder');
}
}).blur(function () {
if ($(this).attr('placeholder') != '' && ($(this).val() == '' || $(this).val() == $(this).attr('placeholder'))) {
$(this).val($(this).attr('placeholder')).addClass('hasPlaceholder');
}
});
$('input[type="text"], textarea').blur();
$(active).focus();
$('form').submit(function () {
$(this).find('.hasPlaceholder').each(function() { $(this).val(''); });
});
}
});
</script>
It is using a text selector , change it to also use textarea. 它使用文本选择器 ,将其更改为也使用textarea。
$(':text')
should be 应该
$(':text, textarea')
or for better performance use 或为了更好的性能使用
$('input[type=text], textarea')
看来您需要将:text
替换为:text,textarea
。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.