Как открыть новое окно при отправке формы

У меня есть форма отправки, и я хочу, чтобы она открывала новое окно, когда пользователи отправляют форму, чтобы я мог отслеживать ее в аналитике.

Вот код, который я использую:

<form action="http://URL at mailchimp subscriber URL.com" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" onclick=window.open(google.html,'','scrollbars=no,menubar=no,height=600,width=800,resizable=yes,toolbar=no,status=no');>
    <label for="name">Your Name</label><input type="text" value="" name="FNAME" class="required" id="mce-FNAME">
    <br/>
    <br/>
    <label for="email">Your Email </label><input type="text" value="" name="EMAIL" class="required email" id="mce-EMAIL">
    <br/>
    <br/>
    <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="submit">
</form>
</div>

Нет необходимости в Javascript, вам просто нужно добавить target="_blank"атрибут в тег формы.

<form target="_blank" action="http://example.com"
      method="post" id="mc-embedded-subscribe-form"
      name="mc-embedded-subscribe-form" class="validate"
>

В веб-приложении базы данных, которое использует всплывающее окно для отображения распечаток данных базы данных, это работало достаточно хорошо для наших нужд (проверено в Chrome 48):

<form method="post" 
      target="print_popup" 
      action="/myFormProcessorInNewWindow.aspx"
      onsubmit="window.open('about:blank','print_popup','width=1000,height=800');">

Хитрость заключается в том, чтобы сопоставить targetатрибут <form>тега со вторым аргументом в window.openвызове onsubmitобработчика.

onclickможет быть не лучшим событием, к которому можно привязать это действие. Каждый раз, когда кто-либо щелкает в любом месте формы, открывается окно.

<form action="..." ...
    onsubmit="window.open('google.html', '_blank', 'scrollbars=no,menubar=no,height=600,width=800,resizable=yes,toolbar=no,status=no');return true;">

Для эффекта, аналогичного targetатрибуту формы , вы также можете использовать formtargetатрибут input[type="submit]"или button[type="submit"].

Из MDN :

... этот атрибут - имя или ключевое слово, указывающее, где отображать ответ, полученный после отправки формы. Это имя или ключевое слово для контекста просмотра (например, вкладки, окна или встроенного фрейма). Если этот атрибут указан, он переопределяет целевой атрибут владельца формы элемента. Следующие ключевые слова имеют особое значение:

• _self: загрузить ответ в тот же контекст просмотра, что и текущий. Это значение используется по умолчанию, если атрибут не указан.
• _blank: загрузить ответ в новый безымянный контекст просмотра.
• _parent: загрузить ответ в родительский контекст просмотра текущего. Если родителя нет, этот параметр ведет себя так же, как _self.
• _top: загрузить ответ в контекст просмотра верхнего уровня (то есть контекст просмотра, который является предком текущего и не имеет родителя). Если родителя нет, этот параметр ведет себя так же, как _self.

Код, который вы ввели, необходимо исправить. В теге формы вы должны заключить значение атрибута onClick в двойные кавычки:

"window.open('google.htm','','scrollbars=no,menubar=no,height=600,width=800,resizable=yes,toolbar=no,status=no');"

Вы также должны позаботиться о том, чтобы первый параметр window.openтакже был заключен в кавычки.

Обычно я использую небольшой фрагмент jQuery по всему миру, чтобы открывать любые внешние ссылки в новой вкладке / окне. Я добавил селектор формы для своего сайта, и пока он работает нормально:

// URL target
    $('a[href*="//"]:not([href*="'+ location.hostname +'"]),form[action*="//"]:not([href*="'+ location.hostname +'"]').attr('target','_blank');

Я считаю, что этот jquery работает для вас, пожалуйста, проверьте код ниже.

это заставит ваше действие отправки работать и открыть ссылку на новой вкладке, хотите ли вы снова открыть URL-адрес действия или новую ссылку

jQuery('form').on('submit',function(e){
setTimeout(function () { window.open('https://www.google.com','_blank');}, 1000);});})

Этот код работает для меня идеально ..

window.open не работает во всех браузерах, погуглите, и вы найдете способ определить правильный тип диалога.

Кроме того, переместите вызов onclick на кнопку ввода, чтобы он срабатывал только при отправке пользователем.

Я тоже нашел решение. Эта страница помогла мне сегодня, поэтому я тоже публикую здесь повторно.

/** This is the script that will redraw current screen and submit to paypal. */
echo '<script>'."\n" ;
echo 'function serverNotifySelected()'."\n" ;
echo '{'."\n" ;
echo '    window.open(\'\', \'PayPalPayment\');'."\n" ;
echo '    document.forms[\'paypal_form\'].submit();'."\n" ;
echo '    document.forms[\'server_responder\'].submit();'."\n" ;
echo '}'."\n" ;
echo '</script>'."\n" ;

/** This form will be opened in a new window called PayPalPayment. */
echo '<form action="https://www.sandbox.paypal.com/cgi-bin/webscr" name="paypal_form" method="post" target="PayPalPayment">'."\n" ;
echo '<input type="hidden" name="cmd" value="_s-xclick">'."\n" ;
echo '<input type="hidden" name="custom" value="'.$transaction_start.'">'."\n" ;
echo '<input type="hidden" name="hosted_button_id" value="'.$single_product->hosted_button_id.'">'."\n" ;
echo '<table>'."\n" ;
echo '    <tr>'."\n";
echo '        <td><input type="hidden" name="'.$single_product->hide_name_a.'" value="'.$single_product->hide_value_a.'">Local</td>'."\n" ;
echo '    </tr>'."\n" ;
echo '    <tr>'."\n" ;
echo '        <td>'."\n" ;
echo '        <input type="hidden" name="'.$single_product->hide_name_b.'" value="'.$single_product->hide_value_b.'" />'.$single_product->short_desc.' $'.$adj_price.' USD'."\n" ;
                // <select name="os0">
                //     <option value="1 Day">1 Day $1.55 USD</option>
                //     <option value="All Day">All Day $7.50 USD</option>
                //     <option value="3 Day">3 Day $23.00 USD</option>
                //     <option value="31 Day">31 Day $107.00 USD</option>
                // </select>
echo '        </td>'."\n" ;
echo '    </tr>'."\n" ;
echo '</table>'."\n" ;
echo '<input type="hidden" name="currency_code" value="USD">'."\n" ;
echo '</form>'."\n" ;

/** This form will redraw the current page for approval. */
echo '<form action="ProductApprove.php" name="server_responder" method="post" target="_top">'."\n" ;
echo '<input type="hidden" name="trans" value="'.$transaction_start.'">'."\n" ;
echo '<input type="hidden" name="prod_id" value="'.$this->product_id.'">'."\n" ;
echo '</form>'."\n" ;

/** No form here just an input and a button.  onClick will handle all the forms */
echo '<input type="image" src="https://www.sandbox.paypal.com/en_US/i/btn/btn_buynowCC_LG.gif" border="0" alt="PayPal - The safer, easier way to pay online!" onclick="serverNotifySelected()">'."\n" ;
echo '<img alt="" border="0" src="https://www.sandbox.paypal.com/en_US/i/scr/pixel.gif" width="1" height="1">'."\n" ;

Приведенный выше код - это код для одной кнопки. Вы нажимаете кнопку, и текущий экран перерисовывается от покупки до предварительного подтверждения. В то же время он открывает новое окно и передает это новое окно PayPal.