jQuery将表单提交到新选项卡?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (128)

我有一个动作链接的形式,需要每分钟更新标记。当用户单击Submit按钮时,我从API调用中获得新的url/Token。我用的是这样的东西

 <form id="somelink" action="http://some.external.url/" target="_blank" />

 $('#somebutton').click(function(e) {
      e.preventDefault();
      var url = '/apicall?id=' + $('#someid').val();                  
      $.post(url, function(data) {
           $('#somelink').attr('action', data);
           $('#somelink').submit();

问题是,当js/jQuery提交时,它会在一个新窗口中打开,而不需要浏览器中的典型菜单和按钮,而且它的大小与弹出窗口大小相同。

如果没有jQuery,我单击按钮,它将在一个新选项卡中打开。

如何使用jQuery实现这一点?

提问于
用户回答回答于

别捕获click事件,尝试捕获submit事件,如果你发现任何错误,可以使用Event.Predicault();

在这里我用这个代码进行了测试,它运行得很好,

<!doctype html />
<html>
  <head>        
    <title></title>
    <script type="text/javascript" src="jquery.js"/></script>
</head>
<body>
  <form action='http://someSite.com' id='somelink' target='_blank'>
    <input type='text' name='lol' id='lol'/>
    <input type='submit'/>
  </form>
  <script type="text/javascript"/>
      $('#somelink').on('submit',function(e) {
          if($('#lol').val() == "poop"){ //Sample error check
              e.preventDefault();
              alert($('#lol').val());
          }
      });
  </script>
</body>
</html>

这样做的目的是,如果输入“poop”,它不会提交表单,对于其他任何内容,它都会将表单提交到新选项卡。

如果你想异步打开一个选项卡,那么你将遇到困难,这是它能得到的最接近的选项卡。

HTML部件

<form id="someForm" action="about:blank" target="newStuff" />
<input type="submit" value="12345" id="someid" />

JavaScript部分

$(document).ready(function() {
 $('#someForm').submit(function(e) {
    $.ajax({
        url: 'http://search.twitter.com/search.json?',
        dataType: 'jsonp',
        success: function(data) {
            if (data != "") {     
                var link = "http://www.google.com/";
                window.open(link,'newStuff'); //open's link in newly opened tab!
            }
        }
    });
 });
 });
用户回答回答于

我也有过同样的问题,下面是我解决的方法:

<form action="..." method="POST" target="_blank">
<input type="submit" id="btn-form-submit"/>
</form>
<script>
    $('#btn-submit').click( function(){ $('#btn-form-submit').click(); } );
</script>

这会将表单提交到一个新的选项卡中(_),而不使用本机提交按钮。

扫码关注云+社区

领取腾讯云代金券