时间戳

首页 > 解决方案 > Jquery表单提交同时打开新标签

javascript - Jquery表单提交同时打开新标签

问题描述

我创建了一个 html 表单，在其中使用了这个 html 和 js 代码，这些代码将表单值填充到链接并提交到另一个网站。

<form>
<table width="505" border="1">
    <tbody>
        <tr>
            <td width="324">Your name</td>
            <td width="165"><input type="text" name="applicant_UserName" id="name2" /></td>
        </tr>
        <tr>
            <td>Your email address</td>
            <td><input type="text" name="applicant_Email" id="email2" /></td>
        </tr>
        <tr>
            <td>Your mobile number</td>
            <td><input type="text" name="applicant_mobile number" id="mobile number" /></td>
        </tr>
        <tr>
            <td>What is the name of the person you want to nominate as your guarantor?</td>
            <td><input type="text" name="Guarantor applicant_UserName" id="name3" /></td>
        </tr>
    </tbody>
</table>
<input type="submit" value="Submit" />

和js

$(function(){
    $('form').on('submit', function(e){
        var out_url = "https://demo.com/PowerFormSigning.aspx?";
        e.preventDefault();
        var arr  = $('input[type="text"]')
            .map(function(){
            var self = $(this);
            return [self.attr('name'),
                self.val()
           ].join('=');
        })
        .toArray()
        .concat($("option:selected").map(function(){
                var self = $(this);
                return [self.closest('select').attr('name'), self.text()].join('=')
            }).toArray()).join('&');
        window.location.href = out_url + arr;
        
    })
    
})

现在我希望通过单击提交来同时打开另一个新选项卡，其中将显示消息“已提交数据”，并带有少量 css 样式。我尝试了一些代码，但它会打开新窗口，有时浏览器会阻止窗口。请帮我解决提交时重定向到新选项卡的问题，并在浏览器中打开带有少量样式的“数据已提交”消息。

标签： javascripthtmljquerycssforms

解决方案

推荐阅读