在新窗口中打开页面,没有弹出窗口阻止

Question

希望你能在这里帮忙...我有一个表单翻译字段中的单词,用翻译的术语填充字段,然后在一个提交按钮中提交操作.

提交由jquery提出.问题是目标页面被阻止,因为所有3个主要浏览器都将其视为弹出窗口,您是否知道如何将其作为新选项卡或新窗口打开？我不想将目标设置为_self,因为我希望人们也可以打开我的网站.

我相信问题在于这个字符串:

document.forms.form1.submit();

但我也知道应该有一种方法来改写它,这样目标不会被视为弹出窗口.

这是脚本:

<script type="text/javascript">

$(function transle() {
  $('#transbox').sundayMorningReset();
  $('#transbox input[type=button]').click(function(evt) {
    $.sundayMorning(
      $('#transbox input[type=text]').val(), {
        source: '',
        destination: 'ZH',
        menuLeft: evt.pageX,
        menuTop: evt.pageY
      },
      function(response) {
        $('#transbox input[type=text]').val(response.translation);

        //document.getElementById("form1").submit();
        document.forms.form1.submit();

      }
    );
  });
});

</script>

这是形式:

<table id="transbox" name="transbox" width="30px" border="0" cellspacing="0" cellpadding="0">
  <form action="custom-page" method="get" name="form1" target="_blank" id="form1">

    <tr>
      <td>
        <input id="q" name="q" type="text" class="search_input" onFocus="if (this.value == 'Evening dress') {this.value = '';}" onBlur="if (this.value == '') {this.value = 'Evening dress';}" value="Evening dress" />
      </td>
      <td>
        <input type="button" value="Find" style="color: #333; width: 157px; font-weight:bold"></input>
      </td>
    </tr>

  </form>
</table>

编辑

我已尝试提交所有这些字符串:

document.getElementById("form1").submit();
document.forms.form1.submit();
form1.submit();

所有这些都会导致目标被弹出窗口阻止.拜托,有没有其他方法我应该做代码不让它弹出？

也许应该使用onsubmit来制作jQuery？谁知道怎么样？

Answer 1

如果打开选项卡/弹出窗口的命令来自可信任事件,浏览器将仅打开选项卡/弹出窗口而不显示弹出窗口阻止程序.这意味着用户必须主动单击某处以打开弹出窗口.

在您的情况下,用户执行单击以便您拥有受信任的事件.但是,通过执行Ajax请求,您确实会丢失该可信上下文.您的成功处理程序不再具有该事件.避免这种情况的唯一方法是执行同步Ajax请求,该请求会在浏览器运行时阻止它,但会保留事件上下文.

在jQuery中,这应该可以解决问题:

$.ajax({
 url: 'http://yourserver/',
 data: 'your image',
 success: function(){window.open(someUrl);},
 async: false
});

这是你的答案:在用户点击ajax调用后打开没有弹出窗口阻止程序的新选项卡

Answer 2

作为一般规则,弹出窗口阻止程序定位在没有用户交互的情况下启动的窗口.通常,单击事件可以打开窗口而不会被阻止.(除非它是一个非常糟糕的弹出窗口拦截器)

尝试在点击事件后启动

Answer 3

这是所有浏览器中唯一真正为我工作的软件

let newTab = window.open(); newTab.location.href = url;

Answer 4

PS>我在相关问题上发布了这个答案.这是我如何解决我的异步ajax请求丢失可信上下文的问题:

我直接在用户点击上打开了弹出窗口,将URL指向about:blank并在该窗口上获得了一个句柄.您可以在发出ajax请求时将弹出窗口指向"加载"URL

var myWindow = window.open("about:blank",'name','height=500,width=550');

然后,当我的请求成功时,我在窗口中打开我的回调网址

function showWindow(win, url) {
     win.open(url,'name','height=500,width=550');
}