我有一个输入文本字段,应用程序用户可以在其中输入文档描述。在页面加载事件中,我检查此输入字段是否为空。如果为空,我插入以下文本并将样式更改为斜体和红色-
请输入此文档的说明
当页面处于活动状态时,我有事件侦听器onblur
和事件。onfocus
基本上,如果用户单击文本字段,我会将 CSS 改回正常和黑色,并将值恢复为空字符串。
Onblur
我会检查内容 - 如果它是空的,我会回复到“请输入...”消息和红色/斜体 CSS。如果它不为空,我将保持用户输入不变。
我遇到的问题是,在初始页面加载后,如果用户转到另一个页面进行查找然后返回并且他们没有更改文档描述,所以它仍然在说“请输入...... ",红色和斜体的 CSS 不生效。
我在所有浏览器的 Firefox 中都遇到了这种情况。
这是我onload
在浏览器中注册页面事件的方式 -
//Microsoft Internet Explorer Browser - iFrame event register
if (navigator.appName.indexOf("Microsoft") != -1) {
var frame = getPortlet();
frame.contentWindow.location.replace('${channelUrl}');
var prevPortletLoadEvent = frame.onload ? frame.onload : function () {};
var refresh = function() {
prevPortletLoadEvent();
resizePortletContainer();
attachTinyButtonListener();
attachDocumentDescriptionListener();
enforceDocumentDescriptionStyleIfNecessary();
};
if(frame.attachEvent) { frame.attachEvent('onload', refresh); } //IE browsers before version 9
else { frame.addEventListener('load', refresh, false); }
}
//All other major browsers - iFrame event register
else {
var frame = getPortlet();
var prevPortletLoadEvent = frame.onload ? frame.onload : function () {};
frame.onload = function () {
prevPortletLoadEvent();
resizePortletContainer();
attachTinyButtonListener();
attachDocumentDescriptionListener();
enforceDocumentDescriptionStyleIfNecessary();
};
var prevPortletResizeEvent = frame.onresize ? frame.onresize : function () {};
var onresize = function () {
prevPortletResizeEvent();
resizePortletContainer();
attachTinyButtonListener();
attachDocumentDescriptionListener();
enforceDocumentDescriptionStyleIfNecessary();
};
}
这是enforeDocumentDescriptionStyleIfNecessary
-
function enforceDocumentDescriptionStyleIfNecessary() {
var efrm = getPortlet();
var e_doc = efrm.contentDocument ? efrm.contentDocument: efrm.contentWindow.document;
var e_docElement = e_doc.getElementById('document.documentHeader.documentDescription');
if (e_docElement.value == 'Please enter a description for this document') {
e_docElement.style = 'italic';
alert("1");
e_docElement.color = 'red';
alert("2");
}
}
代码在页面加载时执行。警报框显示出来1
,2
我可以在每个警报框之后直观地检查该元素的 html)。
样式未添加!就好像这段代码被执行但被忽略了......
我究竟做错了什么?