focus()在边缘浏览器中不起作用

时间:2016-03-11 19:34:37

标签: javascript java jquery html javascript-events

我在点击按钮后使用popup.focus()来聚焦弹出窗口。除了**** EDGE ****浏览器之外,focus()适用于所有浏览器。我面临的问题是间歇性的。有时我能够在浏览器上查看弹出窗口(子弹出对话框),有时在浏览器后面,即在桌面上,我可以通过任务栏上的闪烁识别弹出窗口是打开的。

任何建议都会非常感激

var popup = new PopupWind(url,'config')
popup.setFeature('height', height)
popup.setFeature('resizable', 'no')
popup.setFeature('scrollbars', 'no')
popup.setFeature('left', xLoc) // IE
popup.setFeature('top', yLoc)
popup.setFeature('screenx', xLoc) // NS
popup.setFeature('screeny', yLoc)  
popup.open()
popup.focus();

我尝试使用它来使focus()在EDGE中工作,但它没有

popup.blur();
setTimeout( popup.focus,0); 

1 个答案:

答案 0 :(得分:0)

我有一个解决方案/ Hack

请在Edge浏览器中打开解决方案的链接 https://codepen.io/PocketNinjaDesign/pen/OgbQXO

窗口没有间歇对焦!

问题是你需要弄乱页面的焦点。如果你打开一个弹出窗口,然后专注于父页面,那么移动父页面甚至只有1个像素。单击该按钮将再次关注弹出窗口。

因此,对于一个残缺的网络浏览器,窗口方法似乎无法工作,除了等待几年,他们才能解决他们的焦点()错误。

好吧,黑客是通过生成临时空弹出窗口从父窗口中删除焦点。然后专注于主弹出并关闭临时弹出窗口。全部由setTimeout @ 300ms包裹,任何更低,它似乎不适合我。

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<div id="button" class="bttn">Open Popup</div>
<div id="focus" class="bttn focus">Focus on Popup</div>

JAVASCRIPT

// This is the main guts of this page!
var isMSEdge = function() {
  return window.navigator.userAgent.toLowerCase().indexOf('edge') > -1;
};

$(function() {
  var $bttn = $('#button');
  var $focusBttn = $('#focus');
  var tempWin;
  var testWindow;

  $bttn.on('click', function() {
    testWindow = window.open('', "pocketninja", "width=300, height=300");
    $focusBttn.show();
    $(this).hide();
  });

  $focusBttn.on('click', function() {
    if(testWindow && isMSEdge()) {
        tempWin = window.open('', 'temp', 'width=1, height=1');

        setTimeout(function() {
          testWindow.focus();
          tempWin.close();
        }, 300);   
    }
    else {
      testWindow.focus();
    }
  });
});