专注于DOM元素不起作用
[英]focus to a DOM element doesn't work
问题描述
I have this function on a Marionette view 
我在木偶视图上具有此功能
onShow: function(){
// $('#boxId').val("I am here");
$('#boxId').focus();
}
When I use the $('#boxId').val("I am here"); 当我使用$('#boxId').val("I am here"); it works well and the element's value is I am here . 它工作正常，元素的值在I am here 。 But when I try to focus on that element, it doesn't work, it doesn't focus. 但是，当我尝试着重于该元素时，它不起作用，也就不集中。 Any idea what is the problem? 知道是什么问题吗？
I also tried 我也试过
<input type="text" class="input_txt" id="boxId" maxlength="8" onload="$('#boxId').focus()">
and 和
onShow: function(){;
$(document).ready(function(){
$('#boxId').focus();
});
}
but it also didn't work. 但它也不起作用。
Finally solved with: 终于解决了：
onShow: function(){
setTimeout(function(){
$('#boxId').focus();
},1000);
},
4 个解决方案
解决方案1
2 已采纳 2013-11-19 01:30:39
I'm in agreement that setTimeout is not the best solution and also and indication that you are trying to access the element before it exists. 我同意setTimeout并不是最好的解决方案，并且表明您正在尝试访问元素之前。
I've found that the onShow method can behave strangely if you are working with deeply nested layouts and views. 我发现，如果使用深度嵌套的布局和视图， onShow方法的行为可能会很奇怪。 What can happen is that if at any point in the hierarchy you call .show() in onRender of a layout then every subview of that layout will respond immediately to the "show" triggered by that particular show() . 可能发生的是，如果在层次结构的任何点上在布局的onRender中调用.show() ，则该布局的每个子视图都将立即响应由该特定show()触发的“ show”。 This means these views' onShow() methods can be invoked well before their DOM subtrees are ready or inserted in the DOM. 这意味着这些视图的onShow()方法可以在它们的DOM子树准备好或插入DOM中之前被调用。
If you're doing a lot of deeply nested views, I'd check through carefully and make sure that you are only calling .show() in your layouts' onShow method. 如果您要进行很多深层嵌套的视图，我将仔细检查并确保您仅在布局的onShow方法中调用.show() 。
解决方案2
0 2013-11-12 18:11:15
改用它： $('#boxId')[0].focus()
解决方案3
0 2013-11-12 18:14:14
I'm curious is it valid to focus a label? 我很好奇聚焦标签是否有效？ Try focusing the input instead? 尝试集中输入？ Are you calling focus at the correct time? 您是否在正确的时间打电话给焦点？ Have you tried doing it in a document on ready or settimeout or body onload 您是否尝试过在准备就绪或settimeout或正文加载时在文档中执行此操作
$(document).ready(function(){
$('#myBox').focus();
});
setTimeout(function(){
$('#myBox').focus();
},1000);
<body onload="$('#myBox').focus();">
http://api.jquery.com/focus/ http://api.jquery.com/focus/
--Note the document on ready goes in the page randomly and runs on page load -请注意，准备就绪的文档会随机进入页面并在页面加载时运行
<input type="text" id="selectMe"/>
<script>
$(document).ready(function(){
$('#selectMe').focus();
});
</script>
解决方案4
0 2013-11-12 18:40:07
If you use setTimeout then I would guess that you're calling $('#boxId').focus(); 如果使用setTimeout那么我猜您正在调用$('#boxId').focus(); before the element is available -- your <script> is above your <input> . 在元素可用之前-您的<script>在<input>之上。
You should be placing your <script> tags just before the closing body tag </body> in almost every circumstance. 几乎在每种情况下，您都应将<script>标记放在结束body标记</body>之前。 There are lots of reasons for this, and preventing this type of issue is one of them. 造成这种情况的原因很多，防止此类问题就是其中之一。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.