jQuery更改聚焦选项卡或聚焦输出

jQuery change focus on tab or focusout

本文关键字：聚焦 输出 选项 jQuery      更新时间：2023-09-26

（对不起我的英语）

嗨！，我在一个应用程序中使用jquery，我有一个普通创建的表，里面有文本输入，如下所示：

<td><input type="text" id="code"></td>
<td><select id="type"><option value="0">Normal</option><option value="1">Other</option></select></td>
<td><input type="text" id="price" class="price"></td>
<td><input type="text" id="total"></td>

在另一部分，我有一个按钮，当点击这个按钮时，在表中创建另一行。

此表和按钮的容器存在于模板内。。这些模板是使用undercore.js 渲染的

现在的问题是：我需要按顺序迭代输入：代码、类型、价格。当我填写输入价格时，我计算总额并显示在输入中，然后我需要将焦点更改为按钮（#more_button），让用户单击或按enter键在表中创建另一行。

我使用这个：

$('.price').blur(function(e){
    _this.setTotal($(e.currentTarget).val());
    $('#more_button').removeClass('inactive').focus();
    e.preventDefault();
    e.stopPropagation();
});

当#more_button聚焦时，css背景会发生变化。

当我执行这段代码时，按钮会更改背景，但焦点会随之更改为url栏。这发生在firefox和Chrome中。

我试着用这个来设置焦点：

   $('.price').blur(function(e){
    _this.setTotal($(e.currentTarget).val());
    $('#more_button').removeClass('inactive').;
    setTiemout(function(){
         $('#more_button').focus();
    },100);
    e.preventDefault();
    e.stopPropagation();
});

但也不起作用。。。。。

你能提供一些指导来简化这一点吗？

当按下Tab键或单击页面的其他部分时，用户可以更改input.price的焦点。。此时此刻，我需要触发seTotal并专注于按钮。

我不知道的简单方法是什么

$('your_selector').focusout(function(){
   $('#more_button').focus();
});

无法使用制表键（只能使用鼠标更改焦点）。。所以我使用keydown事件和focusout之间的混合来解决问题。像这样：

$('.price').bind('keydown',function(e){
    if(e.keyCode === 9){//Tab key
    tab = true;
    check(e);
        return false;
}
 }).bind('focusout',function(e){
if(!tab){
    check(e);
}else{
    tab = false;    
} 
e.preventDefault();
return false;
 });

其中check（）是一个验证值的函数，tab则是一个检查是否按下tab键的标志。

$('your_selector').focusout(function(){
  $('#more_button').focus();
});

至少在FF和chrome中工作。

这里有一把小提琴：http://jsfiddle.net/Zabn4/

最现代的解决方案（jQuery 1.7+）是使用以下代码：

$('#your-input').on('focusout', function(e){
   $('#submit-btn').focus();
});
相关文章：