Question

我有一个有1个输入的模型。另外，我有一个收藏品。现在，当我向集合中添加模型时，我想将焦点设置为它的输入。确切地说，我需要将焦点设置在新创建的模型视图的输入上。

然而，我似乎无法让它发挥作用。这是我的函数，它将模型的视图添加到集合视图中：

addOne: function(InvoiceItem) {
    var view = new InvoiceItemView({model: InvoiceItem});
    this.$('tr[data-id="'+InvoiceItem.get('after')+'"]').after(view.render().el);
    this.$('tr[data-id="'+InvoiceItem.cid+'"]').css('background', 'green');
    this.$('tr[data-id="'+InvoiceItem.cid+'"] input').focus();
},

问题是，第三个电话：this.$('tr[data-id="'+InvoiceItem.cid+'"] input').focus();没有做任何事情。这很奇怪，因为我似乎只能在根元素tr上进行DOM操作，除此之外别无其他。

在我看来，jQuery不知道元素是否存在，这很奇怪，因为当我alert(this.$('tr[data-id="'+InvoiceItem.cid+'"] input').length)时，我得到1，这表明该元素存在。

我在这里做错了什么？

Answer 1

使用_.defer解决了我的问题：

var $this = this;
_.defer(function(){
  $this.$('tr[data-id="'+InvoiceItem.cid+'"] input').focus();
});

Answer 2

而不是this.$('tr[data-id="'+InvoiceItem.cid+'"] input').focus();

试试这个

$(view.render().el).find('input').focus();

Answer 3

我遇到了一个与你非常相似的问题，并在搜索解决方案时结束了。你的帖子是几个月前的，所以你可能已经过了这个，但希望这会帮助别人。我能够使用jQuery's ready function handler解决问题。我一直认为它只能在document上使用，但你也可以在子节点上使用它。试试这个：

addOne: function(InvoiceItem) {
  var view = new InvoiceItemView({model: InvoiceItem});
  $('tr[data-id="'+InvoiceItem.get('after')+'"]').ready(function(){
    $('tr[data-id="'+InvoiceItem.cid+'"]').css('background', 'green');
    $('tr[data-id="'+InvoiceItem.cid+'"] input').focus();
  });
  $('tr[data-id="'+InvoiceItem.get('after')+'"]').after(view.render().el);

backbone.js：在渲染后将焦点设置为输入

3 个答案: