闪烁的输入文本框 [英] flickering input textbox
问题描述
大家好，
我正在研究导致输入框闪烁的错误.该页面是动态创建的，我注意到当您开始在空白框中键入内容时，文本将闪烁，而当您删除该框的内容时，除非您转到其他框，否则不会显示您键入的内容并单击返回到框，您将看到文本.
我发现在创建页面时，如果我将内容设置为none(我尝试了<！-->)，那么问题就消失了.基本上，文本框不喜欢为空！
更新1:
浏览器类型:IE
输入框是表的一部分，内容用以下代码填充:
Hey Guys,
I am working on a bug causing a flickering input box. The page is dynamically created, and I noticed when you start typing in the empty box the text will be flickering as you type and when you delete the content of the box then whatever you type won''t be displayed unless you go to different box and click back to the box and you will see the text.
I noticed when the page is created if I set the content to none empty( I tried <!-- -->) then the problem goes away. Basically, the textbox does not like to be empty!!!
Update1:
Browser Type: IE
The input box is part of a table and the content is filled with the following code:
function enableDesignMode(rte, html, readOnly)
{
var frameHtml
if (fnSetContent.html == null)fnSetContent.html = new Array();
fnSetContent.html[rte] = [html, readOnly];
if(html.length == 0 )
{
frameHtml = '<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">';
frameHtml += "<html id=\"" + rte + "\">\n";
frameHtml += "<html>\n<head>\n";
//to reference your stylesheet, set href property below to your stylesheet path and uncomment
if (cssFile.length > 0)
{
frameHtml += "<link media=\"all\" type=\"text/css\" href=\"" + cssFile + "\" rel=\"stylesheet\">\n";
}
else
{
frameHtml += "<style>\n";
frameHtml += "body {\n";
frameHtml += " background: #FFFFFF;\n";
frameHtml += " margin: 0px;\n";
frameHtml += " padding: 0px;\n";
frameHtml += " font-family: Tahoma, Verdana, Arial;\n";
frameHtml += " font-size: 80%;\n";
frameHtml += "}\n";
frameHtml += "</style>\n";
}
frameHtml += "</head>\n";
frameHtml += "<body>\n";
frameHtml += html + "\n";
frameHtml += "</body>\n";
frameHtml += "</html>";
}
else
frameHtml = html;
if (document.all)
{
// if (fnSetContent.html == null)fnSetContent.html = new Array();
// fnSetContent.html[rte] = [frameHtml, readOnly];
if (fnSetContent.html != null)
{
fnSetContent.html[rte][0] = frameHtml;
fnSetContent.html[rte][1] = readOnly;
}
var oRTE = frames[rte].document;
if (frames[rte].ready)
{
oRTE.open();
oRTE.write(frameHtml);
oRTE.close();
}
rteCommand(rte, "fontsize", "2");
oRTE.onselectionchange = new Function("updateFont('" + rte + "');");
oRTE.onkeyup = new Function("handleFont('" + rte + "');");
if(frameHtml.indexOf("STYLE") == -1)
{
setTimeout("setEditorStyles('" + rte + "');", 10);
}
}
else
{
...
然后完成其他一些工作
}
...
其中"html"是输入框的内容...如果为空，则执行if部分会导致闪烁问题！
update2:
***我在其中一个页面中注意到，删除 DTD 将解决此问题，但随后文本框显示 undefined .(更新)获取undefined是我的错，并且不是删除DTD的结果，所以不要介意...
update3:
删除url部分将解决闪烁问题，并且文本框未使用 undefined
初始化
现在，我想知道如果忽略doctype标记中的url字段会带来什么后果?
原文:
<！DOCTYPE HTML PUBLIC-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">
已修改:
<！DOCTYPE HTML PUBLIC-//W3C//DTD HTML 4.01 Transitional//EN">
...
then some other work is done
}
...
where the ''html'' is the content of the input box...when it is empty the if part get executed which causes the flickering problem!!!
update2:
*** I noticed in one of the pages, removing DTD will fix the issue, but then the text box shows undefined.(update)getting undefined was my fault, and not the result of removing DTD, so never mind this...
update3:
Removing the url part will fix flickering issue and the text box does not get initialized with undefined
Now, I am wondering what will be consequences if one omits the url field in a doctype tag?
original:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
modified:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
推荐答案
因此，我最终删除了已修复的Doctype标记(或遮罩的:))问题……但是我认为实际的问题是调用验证，这可能某种程度上是循环的，所以我将在以后进行调查并发布更新.
So, I ended up removing Doctype tag which fixed ( or masked :) ) the issue...but I think the actual problem was call to validation which probably was somehow in loop, so I will investigate that later and post updates.
这篇关于闪烁的输入文本框的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
