如何强制对焦面板输入。 Firefox插件sdk

时间:2014-11-08 02:49:03

标签: firefox firefox-addon xul firefox-addon-sdk

我遇到了一个问题,即如果在当前窗口的页面上通过javascript触发焦点,它会从我的插件输入中窃取焦点。有没有办法强制面板中的输入保持专注。

    $(inputSelector).focusout(function(){
        $(inputSelector).focus();
    }); 

    $(inputSelector).blur(function(){
        $(inputSelector).focus();
    }); 

我已经尝试了上面的内容,它似乎适用于我的测试页面但不在我的面板中:(。

根据文档 - > https://developer.mozilla.org/en-US/Add-ons/SDK/High-Level_APIs/panel 将焦点设置为false

  

设置为false以防止在显示面板时将焦点移开。   只在必要时关闭它,以防止可访问性问题。   可选,默认为true。

我已经设置了我的面板。

    var text_entry = require("sdk/panel").Panel({
        width: text_entry_width,
        height: text_entry_h,
        focus: false, // doesnt seem to work....

        contentURL: data.url("entry.html"),

        contentScriptFile: [
            data.url("jquery-2.1.1.min.js"),
            data.url("text.js")
        ],

        contentStyleFile: [
            data.url("styles.css")
        ]
    });

不会将其设置为false工作:(。

任何帮助,指导或评论都会很棒:)干杯。

_____________更新____________________________________________

我的不好解释似乎有些混乱:(所以我已经向youtube上传了一个视频,希望能够更好地解释这个问题。

https://www.youtube.com/watch?v=5fhJzpa515Y&feature=youtu.be

下面还可以找到更多代码。

Panel Html

    <html>
        <head></head>
        <body>
            <div id="resultTableTop" class="resultTable"></div>
            <input type="text" id="edit-box"></input>
            <div id="resultTableBottom" class="resultTable"></div>
        </body>
    </html>

热键代码

    var showHotKey = Hotkey({
        combo: "accel-t",
        onPress: function() {
            text_entry.show();
        }
    });

Panel js show listenter

    self.port.on("show", function onShow() {
        $('input').focus();
        console.log('hi');
    });

希望现在有点清楚了:)感谢目前为止的帮助:)。

2 个答案:

答案 0 :(得分:0)

此代码在打开时关注面板的输入字段:

main.js文件:

//main.js file
var text_entry = require("sdk/panel").Panel({
    focus: true, //THIS SHOULD BE TRUE
    contentURL: data.url("panel.html"),
    contentScriptFile: [
        data.url("js/libs/jquery-1.11.1.js"),
        data.url("get-text.js")
    ]
});

text_entry.on("show", function() {
    text_entry.port.emit("show");
});

注入面板的get-text.js文件:

//data/get-text.js file
self.port.on("show", function onShow() {
    $('input').focus();
});

答案 1 :(得分:0)

这是一个未经测试的hacky解决方案:

var { viewFor } = require("sdk/view/core");
var { Panel } = require("sdk/panel");


var panel = Panel({
  ..
  onShow: function() {
    var view = viewFor(panel);
    view.setAttribute("noautohide", "true");
  }
})

For more information of the panel noautohide attribute click here