现在,当我单击文本区域输入文本时,我的文本区域背景中会出现一个占位符。
但是,即使我不在文本区域内单击,我也希望显示占位符。我只想在加载文本区域时显示文本?
这是我的占位符的主要代码:
if (selectItem != null) {
var notesContent = selectItem.description;
var textarea;
var browser = BrowserSide.BrowserCompatibility.GetBrowser();
if (browser == "Explorer") {
textarea = '<div class="light-list-box" style="padding:10px;width: 100%; height: 100%; border:none "><textarea id="notes-content" class="image-textarea" style="resize: none; width:85%; height:195px; overflow:auto" cols="5" rows="10" name="Note">{0}</textarea></div>';
} else {
var placeHolder = BrowserSide.GlobalObjects.getString("TextareaPlaceHolder");
textarea = '<div class="light-list-box" style="padding:10px;width: 100%; height: 100%; "><textarea placeholder="' + placeHolder + '" id="notes-content" class="image-textarea" style="resize: none; width:85%; height:195px; overflow:auto" cols="5" rows="10" name="Note">{0}</textarea></div>';
}
if (notesContent != null && notesContent != '') {
$('#notes-content').css('padding', '6px');
textarea = BrowserSide.GlobalObjects.stringFormat(textarea, notesContent);
}
else {
textarea = BrowserSide.GlobalObjects.stringFormat(textarea, '');
}
updateSelector();
notes.html('');
notes.append(textarea);
notes.show();
}
};
当未选择/单击内部文本区域时,如何使占位符显示?
最佳答案
jquery 解决方案:
您可以使用 .focus()
和 .blur()
事件来处理文本区域的内容:
因此,当您聚焦时,您不需要显示任何内容:
$('textarea').focus(function () {$(this).empty()});
当你不关注它时:
$('textarea').blur(function () {$(this).html('your placeholder...').css('color','gray');});
您还可以检查用户是否输入了任何内容:
$('textarea').blur(function () {
if ($(this).text().length == 0)
$(this).html('your placeholder...').css('color','gray');
});
注意:记住在加载文档时设置占位符。最好编写一个供全局使用的函数: http://jsfiddle.net/vesc1zLy/6/
关于javascript - 当未选择文本区域时,如何使占位符显示?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27235917/