Открыть ссылку с помощью onsubmit

Question

У меня есть следующий макет фрагмент кода:

JS:

function generateLink() 
{ 
    var A = document.getElementById('AAA').value; 
    var B = document.getElementById('BBB').value; 

    if(B == "1" || B == "2") 
    link ='http://' + B + '.' + A + '.domain'; 
    else if(B == "3" || B == "4") 
     link ='http://' + B + '.' + A + '.domain/link.jsp'; 
    else 
    link ='/404.html'; 

    return link; 
} 

function showLink() 
{ 
    var link = generateLink(); 

    document.getElementById("link").href = link; 
    document.getElementById("link").innerHTML = link; 
} 

document.formName.onsubmit = function(){ 
    this.action = generateLink(); 
} 

HTML:

<form name="formName" target="_blank"> 

<div style="margin: 0 auto; width:600px;"> 

    <div style="float:left;"><span>Pick AAA</span><br> 
    <select id="AAA" onchange="showLink()"> 
     <option value="11">Eleven</option> 
     <option value="12">Twelve</option> 
     <option value="13">Thirteen</option> 
     <option value="14">Fourteen</option> 
    </select> 
    </div> 

    <div style="float:right;"><span>Pick BBB</span><br> 
    <select id="BBB" onchange="showLink()"> 
     <option value="1">One</option> 
     <option value="2">Two</option> 
     <option value="3">Three</option> 
     <option value="4">Four</option> 
    </select> 
    </div> 

    <div style="float:left; margin-left:120px; margin-right: 40px; margin-top:70px;"> 
    <a href="generateLink()" id="link"></a><br><br> 
    <input type="submit" value="Go to"><br><br> 
    <input type="reset" value="Reset Selection"> 
    </div> 

Когда я запускаю этот код случается что href открывает правильную url на новой вкладке, а submit Кнопка открывает страницу, на которой я нахожусь на новой вкладке. Я не уверен, что я делаю неправильно. Не делает ли document.formName.onsubmit, чтобы кнопка submit работала так же, как и href?

Answer 1

Я попытался настроить скрипку с вашим кодом, и он работал достаточно хорошо. Но, делая это, я понял, что мне нужно переместить часть кода, чтобы избежать небольшой проблемы, поэтому я собираюсь предположить, что у вас такая же ситуация. Я предполагаю, что перед HTML-кодом у вас есть все ваши JavaScript-коды. Когда эта часть

document.formName.onsubmit = function(){ 
    this.action = generateLink(); 
} 

выполнена, форма еще не существует, и onsubmit не может быть установлен (вы должны увидеть ошибку об этом в консоли, тоже). Когда вы нажмете кнопку отправки позже, форма не имеет action, а просто переходит на ту же страницу (ее поведение по умолчанию). Here's a fiddle имеющий с этой проблемой.

Простейшее исправление перемещает назначение onsubmit после формы. Here's the same fiddle, with the relevant code moved, это на самом деле делает, что вы ожидаете.

Answer 2

Вы хотите установить действие = "" на

<form> 

тега. Когда форма будет отправлена, она будет отправлена ​​на страницу, определенную в действии = "". Если он не определен, он будет возвращен на ту же страницу по умолчанию.