首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >Javascript弹出窗口焦点问题

Javascript弹出窗口焦点问题
EN

Stack Overflow用户
提问于 2014-07-18 16:57:54
回答 2查看 7.5K关注 0票数 3

我想要创建一个“弹出窗口”,每次点击按钮时都能获得焦点。下面的函数从onclick事件中执行得很好,但在刷新父页并从onload事件执行时没有按预期执行。

这里是我的函数:

代码语言:javascript
代码运行次数:0
运行
复制
function PopupDelete(delete_images)
{
    var win = window.open('URL','PopupDelete','width=500,height=400,scrollbars=yes');
    win.focus();
}

所以,如果我从下面的按钮中使用这个,它就会像预期的那样工作。

代码语言:javascript
代码运行次数:0
运行
复制
<input type="button" name="delete" value="Images" class="smallbutton" onclick="PopupDelete(delete_images);">

现在我遇到的问题是,我们在按钮上使用另一个名为set_mode的方法,而不是直接调用PopupDelete函数。

代码语言:javascript
代码运行次数:0
运行
复制
function set_mode(mode) 
{
    document.MASTER.mode.value = mode;
    document.MASTER.submit();
}

<input type="button" name="delete" value="Images" class="smallbutton" onclick="set_mode('delete');">

它将主窗体中的模式设置为“删除”并提交该表单。登陆页与表单所在的页面相同。因此,它执行一些php验证,并在body标记中使用onload方法执行onload函数。

代码语言:javascript
代码运行次数:0
运行
复制
<body onload='PopupDelete(delete_images)'>

如果没有弹出窗口打开,它可以正常工作,但如果弹出窗口已经打开并最小化,那么弹出窗口将无法获得焦点。有趣的是,它确实识别并更新了弹出窗口上呈现的内容,但不识别.focus()。

任何建议都将受到广泛的赞赏。

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2014-08-13 21:28:02

在没有用户交互的情况下打开弹出式窗口和在没有用户交互的情况下聚焦弹出式窗口都是浏览器安全性的问题。另外,由于安全性是独立维护的,这是浏览器特有的。

如果用户已经接受显示阻塞的弹出窗口,则可以打开弹出窗口而无需用户交互。但是,允许弹出窗口不允许对任何弹出窗口对象调用focus方法。另一个,所以答案触及到了这个如果您想要更多的信息。

您可以使用以下代码处理此问题。加载页面不允许在Safari、Chrome或Firefox中打开弹出窗口(请记住,我是在mac上,所以windows浏览器的结果可能有所不同)。如果允许被阻止的弹出窗口,或者已经打开了以前访问站点的弹出窗口,那么该窗口将在所有3种浏览器中重新加载url。只有Safari允许在这个已经弹出的窗口上调用focus,而没有用户交互(onload),Chrome和火狐不允许。但是正如您可以看到的那样,单击focus按钮仍然可以将弹出式窗口聚焦到所有3种浏览器上,这表明这是可能的,但浏览器只是阻止了它。因此,从我可以看出,这是可能的,只有在Safari (再次记住,我还没有尝试IE)。但无论是哪种方式,我都不认为强迫你的用户使用特定的浏览器来正确地浏览你的网站是不好的。

代码语言:javascript
代码运行次数:0
运行
复制
var w;

function PopupDelete(delete_images) {
    w = window.open('/testing/t/', 'PopupDelete', 'width=500,height=400,scrollbars=yes');
    console.log(w);
    w.focus();
}

$(function () {
    PopupDelete();

    $('#open').click(PopupDelete);
    $('#focus').click(function () {
        console.log('f', w);
        w.focus();
    });
});

演示

还请记住,即使您可以这样做,当您重新加载父窗口时,它是重新打开弹出窗口并替换前一个窗口(这是必须的,因为据我所知,您无法获得以前打开的窗口的window对象,因此没有办法在不重新打开它的情况下保持该变量的焦点)。所以这个弹出式窗口无论如何也不能保持它的完整性。我认为必须有更好的办法来完成这项任务。

票数 3
EN

Stack Overflow用户

发布于 2014-08-20 11:46:46

在页面加载中,可以显示此弹出窗口。

代码语言:javascript
代码运行次数:0
运行
复制
$(document).ready(function () {
    window.open("URL","Hello","width=500,height=500,scrollbars=yes")
}); 
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/24830249

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档