window.open не работает с формой

Я пытаюсь открыть новую страницу, когда нажата кнопка отправки form. Этот код работает хорошо, когда нет метки <form></form>. Зачем? как я могу заставить его работать с тегом формы там также?window.open не работает с формой

HTML

<form name="input"> 
    <input id="Answer" name="Answer" value="" placeholder="something"/> 
    ... 
    <input id="Answer" name="Answer" value="" placeholder="something"/> 
    <input type="submit" value="Submit" onclick="reload(this)"/> 
</form>

function reload(e) { 
    e.preventDefault(); 
    // do somthing with inputs 
    window.open('new_page.html', '_self'); 
// window.location.href = 'new_page.html'; 
}

Я попытался как window.open('new_page.html', '_self');, window.location.href = 'new_page.html'; а также e.form.preventDefault;

jsFiddle

источник

2013-08-04 Rikard

У вас есть 'window.open()' и 'window.location'; вы пытаетесь открыть новую страницу в этом месте или перенаправить текущее окно на эту страницу? Кроме того, ваш HTML недопустим («input» является пустым элементом и поэтому не имеет закрывающего тега). Потому что с исправленным HTML кажется, что он работает ([открытие в том же окне] (http://jsfiddle.net/davidThomas/UTFqt/2/) или [в новом окне] (http://jsfiddle.net/davidThomas/UTFqt/4 /)). –

@DavidThomas, спасибо за советы по разметке. Это исправит. Я хочу открыть новую страницу на одном и том же лодке. У меня есть окно window.open и окно, чтобы быть ясным. Я попробовал оба. Интересно, почему это работает нормально, если я удаляю теги формы и просто делаю '

Помимо всего прочего вы передаете 'HTMLInputElement' в свою функцию, и в вашей функции вы, кажется, ожидаете события. Если вы посмотрите на консоль, вы увидите сообщение об ошибке: 'Uncaught TypeError: Object # не имеет метода 'preventDefault''. –

Простой ответ заключается в том, что вы не передаете вфункции, вы передаете в HTMLInputElement (с переменной this), если вы проходите в event вместо (и предполагая, скорректированный HTML), с:

<form name="input"> 
    <input id="Answer" name="Answer" value="" placeholder="something"/> 
    <input id="Answer" name="Answer" value="" placeholder="something"/> 
    <input id="Answer" name="Answer" value="" placeholder="something"/> 
    <input type="submit" value="Submit" onclick="reload(event)" /> 
</form>

И:

function reload(e) { 
    console.log(e); 
    e.preventDefault(); 
    // do somthing with inputs 
    window.open('http://example.com/', '_self'); 
}

JS Fiddle demo

Тогда он работает так, как вы ожидаете.

Однако, я бы, лично, предпочитаю не использовать в линии обработки событий, используя вместо этого ненавязчивого JavaScript:

<form name="input" method="post" action="#"> 
    <input id="Answer" name="Answer" value="" placeholder="something" /> 
    <input id="Answer" name="Answer" value="" placeholder="something" /> 
    <input id="Answer" name="Answer" value="" placeholder="something" /> 
    <input type="submit" value="Submit" /> 
</form>

С:

function reload (e){ 
    e.preventDefault(); 
    var win = window.open('http://example.com/', '_self'); 
} 

var form = document.getElementsByName('input')[0]; 

form.addEventListener('submit', reload);

JS Fiddle demo.

источник

2013-08-04 23:23:57

Благодарим вас за хорошее учение! – Rikard

window.open не работает с формой

ответ

Смежные вопросы