Como criar um botão de Cancelamento HTML que redirecciona para um URL
estou a brincar com os botões do editor de Tryit do w3schools, e estou a tentar descobrir como fazer o meu navegador redireccionar para um URL quando carregar no botão "Cancelar".
Eis o que tentei:<form action="demo_form.asp" method="get">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>
<button type="submit" value="Submit">Submit</button>
<button type="reset" value="Reset">Reset</button>
<button type="cancel" onclick="javascript:window.location='http://stackoverflow.com';">Cancel</button>
</form>
10 answers
cancel
não é um valor válido para um atributo type, por isso o botão está provavelmente em falta para submit
e continua a enviar o formulário. Provavelmente queres dizer type="button"
.
(o javascript:
deve ser removido embora, embora não faça nenhum mal, é um rótulo inteiramente inútil )
Você não tem nenhuma funcionalidade tipo botão, então seria melhor se:
<a href="http://stackoverflow.com"> Cancel </a>
... Possivelmente com algum CSS para parecer um botão.
Não existe button type="cancel"
no html. Podes tentar assim.
<a href="http://www.url.com/yourpage.php">Cancel</a>
Você pode fazer com que pareça um botão usando propriedades do estilo CSS.
Em primeiro lugar, não existe tal coisa como <button type="cancel">
, por isso é tratado como apenas um <button>
. Isto significa que o seu formulário será submetido, em vez do botão levá-lo para outro lugar.
Second, javascript:
is only needed in href
or action
, where a URL is expected, to designate JavaScript code. Dentro de onclick
, onde JavaScript já é esperado, ele simplesmente atua como um rótulo e não serve a nenhum propósito real.
<a href="http://stackoverflow.com/">Cancel</a>
Com CSS você pode até fazê-lo parecer o mesmo que um botão, mas com este HTML não há absolutamente nenhuma confusão sobre o que ele deve fazer.
É por omissão a apresentação de um formulário, a maneira mais fácil é adicionar "return false"
<button type="cancel" onclick="window.location='http://stackoverflow.com';return false;">Cancel</button>
<input class="button" type="button" onclick="window.location.replace('your_url')" value="Cancel" />
Basta colocar o tipo= "botão"
<button type="button"><b>Cancel</b></button>
Porque o seu botão está dentro de um formulário, está a tomar o valor por omissão como submit E type="cancelar" não existe.
<a href="index.php"><button style ="position:absolute;top:450px;left:1100px;height:30px;width:200px;"> Cancel </button></a>
<button onclick=\"window.location='{$_SERVER['PHP_SELF']}';return false;\">Reset</button>
Não há representante suficiente para votar no Kostyan. Aqui está a minha solução final (precisava de um botão de reiniciar).
Mais uma vez, obrigado a Kostyan por responder à pergunta, sem Sugerir um método "workaround" (demorado) para "construir um botão" com estilos.
Este é um botão (que o visualizador espera ver) e funciona exactamente como foi pedido. E mistura-se com os outros botões da página. Sem complexidade.
Eu removi o "tipo=Cancelar" que aparentemente era inútil. Então ainda menos código. :)
Aqui, estou a usar o link na forma de botão para cancelar a operação.
<button><a href="main.html">cancel</a></button>
Com Jquery:
$(".cancel-button").click(function (e) {
e.preventDefault();
});