window.open弹出窗口阻塞问题

时间:2017-02-14 13:51:21

标签: javascript jquery

我对代码作为支持技术人员缺乏经验,但我们需要支持"支持"我们的网站。我们有许多文档必须可供下载,因此我们使用下拉选择菜单(如果这是他们被称为?)在列表中单击项目时在新选项卡中打开pdf。然而,我们最近发现这种剂量不能与IOS Safari一起使用,因为它使用弹出窗口阻止,所以我只是想知道你是否能看到解决方法?

这是我们目前的代码。

<li>
   <label for="newsletters" >School Newsletters</label>

   <select name="newsletters" class="newsletters"  id="newsletters" onchange="window.open(this.value)">
    <option value="#">Please Select</option>
    <option value="newsletters/201612.pdf"> December 2016</option>
    <option value="newsletters/201607.pdf"> July 2016</option>
    <option value="newsletters/201603.pdf"> March 2016</option>
    <option value="newsletters/201512.pdf"> December 2015</option>
    <option value="newsletters/201507.pdf"> July 2015</option>

   </select>
</li>

非常感谢任何建议。

感谢J Tech

1 个答案:

答案 0 :(得分:1)

如果您无法通过指向其他问题的链接解决IOS问题,那么可以选择替代选项。

<html>
<head>
    <style>
    ul {
        border: 1px solid black;
        list-style: none;
    }
    #dropdown > * {
        display: none;
    }
    #dropdown > *:first-child, #dropdown.active > * {
        display: block;
    }
    </style>
</head>
<body>
<ul id="dropdown">
    <li>
        <span>Please Select</span>
    </li>
    <li>
        <a href="newsletters/201612.pdf" target="_blank">December 2016</a>
    </li>
    <li>
        <a href="newsletters/201607.pdf" target="_blank">July 2016</a>
    </li>   
    <li>
        <a href="newsletters/201603.pdf" target="_blank">March 2016</a>
    </li>
    <li>
        <a href="newsletters/201512.pdf" target="_blank">December 2015</a>
    </li>
    <li>
        <a href="newsletters/201507.pdf" target="_blank">July 2015</a>
    </li>
</ul>   
<script>
var dropdown = document.querySelector('#dropdown');
dropdown.addEventListener('click', function( event ) {
    if (dropdown.className === 'active') dropdown.className = '';
    else dropdown.className = 'active';
});
</script>
</body>
</html>