ENYOJS:将焦点设置在页面渲染上的默认元素上

时间:2014-08-07 20:39:10

标签: javascript enyo

月光石聚光灯。

如何在渲染后将焦点设置为元素(按钮等)?

我已经尝试过nameOfElement.focus(),但这似乎不起作用。

   rendered : function(){
      this.inherited(arguments);
      var buttonreference = this.$.iconbackbuttonmaster;
      buttonreference.focus();
    }

这是>>>> fiddle

4 个答案:

答案 0 :(得分:3)

调用.focus()应该可以。

你记得添加

吗?
this.inherited(arguments);

到你的渲染函数来调用重写的渲染函数?

答案 1 :(得分:3)

在Enyo论坛上回答aarontam:spotlight question

你好,你不需要指定聚光灯:对于月亮来说是真的。因为它已经启用了聚光灯。以编程方式强制使用Moonstone元素的Spotlight焦点可能很棘手,因为一般规则是在指针模式下,只有指针悬停的项目应该被聚焦,否则最终会出现在屏幕上有两个完全不同的控件的情况聚焦焦点。你有时可以通过禁用指针模式来解决这个问题,但这应该会迫使你暂停并重新考虑为什么你首先要以编程方式发现它。

enyo.create({
    components: [
        {name: 'myButton', kind: 'moon.Button', content: 'button to focus'}
    ],
    rendered: function(){
        this.inherited(arguments);
        enyo.Spotlight.setPointerMode(false);
        enyo.Spotlight.spot(this.$.myButton);
    }

}).renderInto(document.body);

这是一个应该实现你想要的例子:

http://jsfiddle.net/aarontam/uam83z55/5/

或者,您可以将“聚光灯”类添加到您的按钮中,但是球会在您的法庭上管理以适当地删除该类:

http://jsfiddle.net/aarontam/uam83z55/6/

答案 2 :(得分:2)

以编程方式强制Spotlight元素的Moonstone焦点需要谨慎,因为一般行为要求在指针模式下,只有指针悬停的项目应该被聚焦,否则你最终会得到您可以在焦点Spotlight的屏幕上拥有多个控件的场景。如果有必要,您通常可以通过显式禁用指针模式来绕过此内置逻辑,但这应该会强制您暂停并重新考虑您首先以编程方式发现的原因。这是一个应该完成你想要的例子(http://jsfiddle.net/aarontam/uam83z55/5/):

enyo.create({
    components: [
        {name: 'myButton', kind: 'moon.Button', content: 'button to focus'}
    ],
    rendered: function(){
        this.inherited(arguments);
        enyo.Spotlight.setPointerMode(false);
        enyo.Spotlight.spot(this.$.myButton);
    }
}).renderInto(document.body);

或者,您可以将spotlight类添加到您的控件中,但是开发人员有责任根据需要管理类的删除(http://jsfiddle.net/aarontam/uam83z55/6/):

enyo.create({
    components: [
        {name: 'myButton', kind: 'moon.Button', content: 'button to focus', classes: 'spotlight'}
    ]
}).renderInto(document.body);

答案 3 :(得分:-1)

确保等到页面加载后再尝试执行此操作:

window.onload = function() {
    document.getElementById("idOfElement").focus();
};