在新窗口中打开页面而不阻止弹出窗口

2022-01-20 00:00:00 popup jquery javascript

希望您能在这里提供一些帮助...我有一个表单可以翻译字段中的单词，用翻译后的术语填充字段，然后在一个提交按钮中执行所有提交操作.

Hope you can help a bit here... I have a form that translate a word in a field, populate the field with the translated term and then do submit action all in one submit button.

提交是由 jquery 进行的.问题是目标页面被阻止，因为所有 3 个主要浏览器都将其视为弹出窗口，你知道如何让它像新标签或新窗口一样打开吗?我不想将目标设置为 _self，因为我希望人们也可以打开我的网站.

the submit is being made by jquery. problem is the target page is being blocked as all 3 major browsers treat it as popup, Do you know how to let it open just as a new tab or new window ? I don't want to set the target as _self as I want people to have my site open as well.

我认为问题出在这个字符串中:

I believe the problem is in this string:

document.forms.form1.submit();

但我也知道应该有办法改写它，这样目标就不会被视为弹出窗口.

but I also know there should be a way to rephrase it so the target won't be treated as a popup.

这是脚本:

<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>

编辑

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

I have tried all of these strings to submit: 

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

所有的目标都是弹出窗口被阻止.请问，有没有其他方法可以让代码不让它弹出?

all ends up with the target being popup blocked. please, is there any other way I should do the code to not let it popup ?

也许应该使用 onsubmit 来制作 jQuery ?有人知道吗?

maybe should use the onsubmit to make jQuery ? someone knows how ?

推荐答案

如果打开选项卡/弹出窗口的命令来自 可信事件.这意味着用户必须主动点击某个地方才能打开一个弹出窗口.

A browser will only open a tab/popup without the popup blocker warning if the command to open the tab/popup comes from a trusted event. That means the user has to actively click somewhere to open a popup.

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

In your case, the user performs a click so you have the trusted event. You do lose that trusted context, however, by performing the Ajax request. Your success handler does not have that event anymore. The only way to circumvent this is to perform a synchronous Ajax request which will block your browser while it runs, but will preserve the event context.

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

In jQuery this should do the trick:

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

这是您的答案:在用户点击 ajax 调用后打开没有弹出窗口阻止程序的新标签

相关文章