jsf - 渲染 PrimeFaces <p :focus> component only if the browser window has a certain size

Question

有没有办法渲染 PrimeFaces <p:focus>仅当浏览器窗口具有一定大小时组件(或让它完成其工作)？为此，我了解也许我必须访问服务器代码中的浏览器窗口大小并使用组件 rendered属性来访问此代码。

在客户端代码中，我使用如下代码获取窗口宽度:$(window).width() > 480 .

这样做的原因是我不想将注意力集中在移动设备中的第一个组件，因为移动设备大多数时候都有小屏幕。

今天我使用下面的客户端代码执行此操作，但我想使用 <p:focus>任务的组件，因为它还具有在验证失败时集中第一个无效组件的优点。

$(
    function()
    {
        if (bigWindow())
        {
            focusFirstInput();
        }
    }
)

function bigWindow()
{
    return $(window).width() > 480;
}

function focusFirstInput()
{
    $("#form input:text, #form input[type=number], #form input[type=password], #form textarea").
        first().focus();
}

Answer 1

我找到了一种使用 <p:focus> 的方法组件:

$(
    function()
    {
        let primeFacesOriginalFocusFunction = PrimeFaces.focus;
        PrimeFaces.focus =
            function(id, context)
            {
                if (!isMobile())
                {
                    primeFacesOriginalFocusFunction(id, context);
                }
            }
    }
)

function isMobile()
{
    return ...
}