Як відкрити нове вікно при подачі форми

У мене є форма для надсилання, і я хочу, щоб вона відкрила нове вікно, коли користувачі подають форму, щоб я міг відстежувати її на аналітиці.

Ось код, який я використовую:

<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 працює не в усіх веб-переглядачах, Google це, і ви знайдете спосіб виявлення правильного типу діалогу.

Крім того, перемістіть виклик 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.