Javascript，focus()函数不能使输入框获得焦点
代码如下：【纯HTML+Javascript】<html><head><title>notitle</title></head><scriptlanguage="java...
代码如下：【纯HTML+Javascript】
<html>
<head>
<title>notitle</title>
</head>
<script language="javascript">
function ai(){
if (event.keyCode ==13){
document.getElementById('ad').innerHTML+="input:<input type='text' name='bb' id='bb' onkeypress='ai()'/><br>";
document.getElementById('bb').focus();
}
}
</script>
<body onload="document.getElementById('aa').focus();">
<form id="form1" name="form1" method="post" action="2.asp">
<div id="ad">
input:<input type="text" name="aa" id="aa" onkeypress="ai()"/> <br>
</div>
<input type="button" name="button" id="button" value="submit" onclick="document.getElementById('bb').focus();" />
<input type="text" name="textfield" style="visibility:hidden" />
</form>
</body>
</html>
在页面第一个输入框里按下回车后，可以增加一个输入框，但是却不能让新增的输入框获得焦点。
从代码实现角度来说：第一个输入框有按键盘动作后，触发Javascript函数ai()，此函数检查键盘动作，若是回车，则使用InnerHTML追加一个输入框，此新输入框的id和name都是"bb"，然后，执行Javascript语句：document.getElementById('bb').focus();
按理说，应该能把bb输入框（也就是新增的输入框）得到焦点，但是实际运行中不能获得输入焦点。
请大侠指点指点。
我在csdn上看到高手的解决方案了，大家可以参考下：
function ai(){
if (event.keyCode ==13){
var frag = document.createDocumentFragment();
var tag = document.createTextNode("input:");
var input = document.createElement("input");
input.type="text";
input.name="bb";
input.id="bb";
input.onkeypress = ai;
var br = document.createElement("br");
frag.appendChild(tag);
frag.appendChild(input);
frag.appendChild(br);
document.getElementById("ad").appendChild(frag);
document.getElementById('bb').focus();
}
}
一楼的也谢谢你啦 展开
<html>
<head>
<title>notitle</title>
</head>
<script language="javascript">
function ai(){
if (event.keyCode ==13){
document.getElementById('ad').innerHTML+="input:<input type='text' name='bb' id='bb' onkeypress='ai()'/><br>";
document.getElementById('bb').focus();
}
}
</script>
<body onload="document.getElementById('aa').focus();">
<form id="form1" name="form1" method="post" action="2.asp">
<div id="ad">
input:<input type="text" name="aa" id="aa" onkeypress="ai()"/> <br>
</div>
<input type="button" name="button" id="button" value="submit" onclick="document.getElementById('bb').focus();" />
<input type="text" name="textfield" style="visibility:hidden" />
</form>
</body>
</html>
在页面第一个输入框里按下回车后，可以增加一个输入框，但是却不能让新增的输入框获得焦点。
从代码实现角度来说：第一个输入框有按键盘动作后，触发Javascript函数ai()，此函数检查键盘动作，若是回车，则使用InnerHTML追加一个输入框，此新输入框的id和name都是"bb"，然后，执行Javascript语句：document.getElementById('bb').focus();
按理说，应该能把bb输入框（也就是新增的输入框）得到焦点，但是实际运行中不能获得输入焦点。
请大侠指点指点。
我在csdn上看到高手的解决方案了，大家可以参考下：
function ai(){
if (event.keyCode ==13){
var frag = document.createDocumentFragment();
var tag = document.createTextNode("input:");
var input = document.createElement("input");
input.type="text";
input.name="bb";
input.id="bb";
input.onkeypress = ai;
var br = document.createElement("br");
frag.appendChild(tag);
frag.appendChild(input);
frag.appendChild(br);
document.getElementById("ad").appendChild(frag);
document.getElementById('bb').focus();
}
}
一楼的也谢谢你啦 展开
2个回答
展开全部
你可以看看这个，也许能帮助你明白为什么你原来的方法不行，但是用另一种方法就可以。http://hi.baidu.com/xizhilang6688/blog/item/9ca1c4fe34899d3d5d600869.html
当你使用innerHTML的时候dom 会重绘，重绘意味着那些focus全部不起作用。
至于为什么appendChild 可以呢，是因为你添加的节点不会影响其他的节点。不会造成重绘。
重绘是需要时间的，所以问题就这么产生了。
当你使用innerHTML的时候dom 会重绘，重绘意味着那些focus全部不起作用。
至于为什么appendChild 可以呢，是因为你添加的节点不会影响其他的节点。不会造成重绘。
重绘是需要时间的，所以问题就这么产生了。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
写的太多看起来比较麻烦，我简单的写下我的方法
input:<input id=a>
<input id=b>
<script language='javascript'>
a.focus()
a.onkeyup=function(){if(event.keyCode==13)setTimeout('b.focus()',1)/*注意这句,onkeyup之后的焦点会在当前元素，解决方法就是延迟1会儿*/}
</script>
input:<input id=a>
<input id=b>
<script language='javascript'>
a.focus()
a.onkeyup=function(){if(event.keyCode==13)setTimeout('b.focus()',1)/*注意这句,onkeyup之后的焦点会在当前元素，解决方法就是延迟1会儿*/}
</script>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
