Question

当用户点击#content元素时，我使用以下解决方案来防止.box textarea失去焦点：

// Detect latest element clicked
$(document).mousedown(function(e) {
    lastElClicked = $(e.target);
});

// Prevent loss of focus for textarea when clicking on tools
$("#content").on("blur", function(event) {
    if (lastElClicked.attr('class') == 'box'){
        event.preventDefault();
        this.focus();
        return false;
    }
});

简而言之，在鼠标按下时保存已单击的目标元素。在#content textarea的模糊处，检查点击的最后一个元素是否为.box。如果是，则阻止默认，重新聚焦#content textarea并返回false。

我的解决方案在Chrome下运行得很完美但我仍然在Safari和Firefox下失去了重点。如何通过浏览器进行此工作？

编辑：

提供的解决方案的问题在于元素实际上失去焦点并且在之后重新聚焦。在使用上面代码的Chrome中，我从未真正松散过fucus，这意味着所选文本保持选中状态。

Answer 1

<强>编辑：

试试这个：

// Detect latest element clicked
$(document).mousedown(function(e) {
    window.lastElClicked = $(e.target);
});

// Prevent loss of focus for textarea when clicking on tools
$("#content").on("blur", function(event) {
    if (window.lastElClicked.attr('class') == 'box'){
        event.preventDefault();
        var that=this;
        setTimeout(function(){
            $(that).trigger('focus');
        },200);
        window.lastElClicked="";
        return false;
    }
});

这也是关于这个bug的好文章，似乎是Safari的一部分：http://bugs.jquery.com/ticket/7768

或者你可以尝试这个：

$('.box').click(function(event){
    event.preventDefault();
    $('input').each(function(){
        $(this).trigger('blur');
    });
    setTimeout(function(){
            $('#content').trigger('focus');
        },200);
});

最后我不得不提到它仍然没有把重点放在突出显示的文本上，在我看来这是一个不可能完成的任务！

防止丢失元素焦点（需要跨浏览器解决方案）

1 个答案: