Código para bloquear o enter em inputs

por TED_Junnior 26.09.19 21:43

Detalhes da questão

Endereço do fórum: http://brasilplayhard-rpg.forumeiros.com/forum
Versão do fórum: ModernBB

Descrição

Olá pessoal,

Tenho um formulário e gostaria que o usuário ao pressionar ENTER em uma input ele bloqueie e não faça enviar.

Agradeço,
TED

por **tikky** 26.09.19 22:16

Olá @TED_Junnior,
irei precisar do código do seu formulário, para fazer a adição do seu pedido. Para ver se compreendi o senhor quer que ao clicar em ENTER em um campo (input), o formulário não enviasse?

Aguardo uma resposta sua,
pedxz.

por TED_Junnior 26.09.19 22:25

Isso mesmo, alguns usuários podem se confundir com uma caixa "textarea" e assim apertar ENTER para dar quebra de linha, mas vai resultar no formulário enviado. Portanto acho melhor bloquear o ENTER nas inputs.

por Convidado 27.09.19 15:27

Olá,
Como pedido pelo meu chefe @Pedxz, passe-nos o código do formulário neste tópico.
Cordialmente,
Roger123

por TED_Junnior 27.09.19 19:09

Aqui está, tinha passado pra ele via MP.

por RafaelS. 28.09.19 5:42

Olá!

Troque o código HTML, por este:

Código:: <style> textarea:focus, input:focus, select:focus { border-color: none !important; outline: 0; -webkit-box-shadow: none !important; box-shadow: none !important; } fieldset.fields1 dt { border-right-width: 0; width: 10em; margin-right: 20px; } #right { display: none !important; } select#arte { width: 400px; } dt label { width: 300px; } </style> <ins class="adsbygoogle" style="display:inline-block;width:728px;height:90px" data-ad-client="ca-pub-2561821895901976" data-ad-slot="6187341249"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> <span class="corners-bottom"><span></span></span> <div style="height:1px"></div> <div id = "main"><div id="main-content"> <style> input { height: 18 px; } .submit - buttons { float: left; } </style> <script> $(document).ready(function() { $(window).keydown(function(event){ if(event.keyCode == 13) { event.preventDefault(); return false; } }); }); </script> <script> html_tpl = "<b><font>Nick in-game:</font></b><br>$4 <br><br><b><font>Forma de Pagamento:</font></b><br>$9 <br><br><b><font>Valor Doado:</font></b><br>$8<br><br><b><font>Data do Pagamento:</font></b><br>$5 <br><br><b><font>Nome PAGSEGURO:</font></b><br>$2 <br><br><b><font>Cód. de Transação PAGSEGURO:</font></b><br>$1 <br><br><b><font>Comprovante de Pagamento:</font></b><br>$3 <br><br><b><font>Contato:</font></b><br>$6"; bbcode_tpl = "[b]Nick in-game:[/b]\n$4 \n\n[b]Forma de Pagamento:[/b]\n$9 \n\n[b]Valor Doado:[/b]\nR\$ $8 \n\n[b]Data do Pagamento:[/b]\n$5 \n\n[b]Nome PAGSEGURO:[/b]\n$2 \n\n[b]Cód. de Transação PAGSEGURO:[/b]\n$1 \n\n[b]Comprovante de Pagamento:[/b]\n$3 \n\n[b]Contato:[/b]\n$6"; $(document).ready(function() { $('#bt-selecciona-forum').change(function() { if ($(this).val() !== "") { $('#form-part2, #bts').slideDown(800); $('input[name="f"]').val($(this).val()); } else { $('#form-part2, #bts').slideUp(300); $('input[name="f"]').val($(this).val()); } }); $('#bt-apagar').click(function() { $('#mais-infos, #borda, #tema, #endereco').val(''); $('input[name="f"]').val($(this).val()); }); $('#bt-pr-questao').click(function() { tpl = html_tpl; tpl = tpl.replace("$1", $('#codpag').val()); tpl = tpl.replace("$2", $('#pagname').val()); tpl = tpl.replace("$3", $('#comprovante').val()); tpl = tpl.replace("$4", $('#endereco').val()); tpl = tpl.replace("$6", $('#contato').val()); tpl = tpl.replace("$7", $('#time').val()); tpl = tpl.replace("$8", $('#valor').val()); tpl = tpl.replace("$9", $('#pagamento').val()); tpl = tpl.replace("$5", $('#date').val()); $('html, body').animate({ scrollTop: $("#pr-questao").offset().top }, 800); $('#pr-questao').slideDown(300); $('#html-questao').html(tpl); }); /* Script do Formulário */ // Obtém a data/hora atual var data = new Date(); // Guarda cada pedaço em uma variável var dia = data.getDate(); // 1-31 var dia_sem = data.getDay(); // 0-6 (zero=domingo) var mes = data.getMonth() + 1; // 0-11 (zero=janeiro) var ano2 = data.getYear(); // 2 dígitos var ano4 = data.getFullYear(); // 4 dígitos var hora = data.getHours(); // 0-23 var min = data.getMinutes(); // 0-59 var seg = data.getSeconds(); // 0-59 var mseg = data.getMilliseconds(); // 0-999 var tz = data.getTimezoneOffset(); // em minutos $('#bt-enviar').click(function() { tpl = bbcode_tpl; if ($('#tema').val() !== '' && $('#mais-infos').val() !== '') { tpl = tpl.replace("$1", $('#codpag').val()); tpl = tpl.replace("$2", $('#pagname').val()); tpl = tpl.replace("$3", $('#comprovante').val()); tpl = tpl.replace("$4", $('#endereco').val()); tpl = tpl.replace("$5", $('#date').val()); tpl = tpl.replace("$6", $('#contato').val()); tpl = tpl.replace("$7", $('#time').val()); tpl = tpl.replace("$8", $('#valor').val()); tpl = tpl.replace("$9", $('#pagamento').val()); $('input[name="message"]').val(tpl); $('input[name="subject"]').val('[' + dia + '/' + mes + '/' + ano4 + '] Doação: ' + $('#endereco').val()); $('#bt-enviar-e').click(); } else { $('#erro').slideUp(1); $('#erro').slideDown(800); } }); $('#bt-pr-fechar').click(function() { $('html, body').animate({ scrollTop: $("#pr-questao").offset().top }, 800); $('#pr-questao').slideUp(300); return false; }); $('#tema').click(function() { if ($('#tema').val() == 'Cole aqui o link ou código da imagem, do download.') { $('#tema').val(''); } }); $('#tema').blur(function() { if ($('#tema').val() == '') { $('#tema').val('Cole aqui o link ou código da imagem, do download.'); } }); $('#designer').click(function() { if ($('#designer').val() == 'Qualquer') { $('#designer').val(''); } }); $('#designer').blur(function() { if ($('#designer').val() == '') { $('#designer').val('Qualquer'); } }); $('#borda').click(function() { if ($('#borda').val() == 'R$ (in-game)') { $('#borda').val(''); } }); $('#borda').blur(function() { if ($('#borda').val() == '') { $('#borda').val('R$ (in-game)'); } }); $('#nicks').click(function() { if ($('#nicks').val() == 'Coloque todos os nicks que já usou.') { $('#nicks').val(''); } }); $('#nicks').blur(function() { if ($('#nicks').val() == '') { $('#nicks').val('Coloque todos os nicks que já usou.'); } }); $('#mais-infos').click(function() { if ($('#mais-infos').val() == 'Alguma outra informação sobre o seu conteúdo') { $('#mais-infos').val(''); } }); $('#mais-infos').blur(function() { if ($('#mais-infos').val() == '') { $('#mais-infos').val('Alguma outra informação sobre o seu conteúdo'); } }); if (VarGET('f') !== '') { $('#form-part2, #bts').slideDown(800); $('input[name="f"]').val(VarGET('f')); $('#bt-selecciona-forum').val(VarGET('f')); } }); </script> <form action="/post" method="post" id="form-submit"> <div id="erro" style="display:none;" class="panel"> <div class="inner"> <span class="corners-top"><span></span></span> <center> <span class="conteudo_texto" style="color:#C00"><strong>Você deve preencher todos os campos</strong></span> </center><span class="corners-bottom"><span></span></span> </div> </div> <div style="display:none;" id="pr-questao" class="post row2"> <div class="inner"> <span class="corners-top"><span></span></span> <div class="postbody"> <div class="h3"> Pré-visualizar [<a id="bt-pr-fechar" href="#">Fechar o modo de pré-visualização da questão</a>] </div> <div id="html-questao" class="content"> </div> </div><span class="corners-bottom"><span></span></span> </div> </div> <hr style="display:none;" id="pr-questao" /> <div class="panel">  <p class="alert alert-info"> <strong>Por favor, leia com atenção!</strong> <br> <br> Calma aí, amigo(a)... Você já viu as regras dessa área aqui? Se você já estiver por dentro... siga em frente. </p> <span class="corners-bottom"></span> </div> <div id="form-part1" class="panel"> <div class="inner"> <span class="corners-top"><span></span></span> <div class="h3" style="margin-top: 7px;">Confirmação de Doação<del></del></div> <fieldset class="fields1"> <dl> <dt> <label><strong>Escolha uma categoria:</strong></label> <select id="bt-selecciona-forum" tabindex="1" class="inputbox" style="width: 400px; height: 35px;"> <option value="">Selecionar</option> <option value="95">Confirmar Doação</option> </select> </dt> <dd> </dd> </dl> </fieldset> <span class="corners-bottom"><span></span></span> </div> </div> <div class="panel" id="form-part2" style="display:none;"> <div class="inner"> <span class="corners-top"><span></span></span> <div class="victor"> <fieldset class="fields1"> <dl> <dt> <label><strong>Seu nick in-game:</strong></label> <input id="endereco" name="subject" placeholder="O nick deve ser IDENTICO ao do servidor." class="inputbox" style="clear: both; width: 400px; height: 35px;"/> </dt> <dd> </dd> </dl> <dl> <dt> <br /> <label><strong><strong>Forma de pagamento:</strong></strong></label> <select name="pagamento" value="Selecionar" class="inputbox" id="pagamento" style="clear: both; width: 400px; height: 35px;" tabindex="1"> <option value="">Selecione uma opção</option> <option value="Paypal">Paypal</option> <option value="PagSeguro">PagSeguro</option> <option value="Depósito/Transferência">Depósito/Transferência</option> <option value="PicPay">PicPay</option> <option value="MercadoPago">MercadoPago</option> </select> </dt> <dd> </dd> </dl> <dl> <dt> <br /> <label><strong><strong>Valor da doação:</strong></strong></label> <input name="valor" onkeypress="return event.charCode >= 48 && event.charCode <= 57" placeholder="Informe o valor correspondente a doação que você fez." class="inputbox" id="valor" style="clear: both; width: 400px; height: 35px;"></input> </dt> <dd> </dd> </dl> <br /> <dl> <dt> <label><strong><strong>Data do Pagamento:</strong></strong></label> <input type="date" name="date" min="2019-01-01" max="2020-12-31" class="inputbox" id="date" style="clear: both; width: 400px; height: 35px; text-transform: uppercase;"></input> </dt> <dd> </dd> </dl> <br /> <dl> <dt> <label><strong><strong>Horário do Pagamento:</strong></strong></label> <input type="time" name="time" value="00:00" class="inputbox" id="time" style="clear: both; width: 400px; height: 35px; text-transform: uppercase;"></input> </dt> <dd> </dd> </dl> <br /> <dl> <dt> <label><strong><strong>Nome do comprador (APENAS PAGSEGURO):</strong></strong></label> <input id="pagname" name="pagname" placeholder="Informe o nome caso seja pagamento pelo PAGSEGURO." class="inputbox" style="clear: both; width: 400px; height: 35px;"/> </dt> <dd> </dd> </dl> <dl><br /> <dt> <label><strong><strong>Código de Transação (APENAS PAGSEGURO):</strong></strong></label> <input id="codpag" name="codpag" placeholder="Informe o código de transação caso seja pagamento pelo PAGSEGURO." class="inputbox" style="clear: both; width: 400px; height: 35px;"/> </dt> <dd> </dd> </dl><br /> <dl> <dt> <label><strong><strong>Comprovante de Pagamento:</strong></strong></label> <input id="comprovante" name="comprovante" placeholder="Hospede a imagem/foto no IMGUR.COM e coloque o link aqui." class="inputbox" style="clear: both; width: 400px; height: 35px;"/> </dt> <dd> </dd> </dl><br /> <dl> <dt> <label><strong><strong>Contato:</strong></strong></label> <input id="contato" name="contato" placeholder="Se precisarmos falar com você, deixe seu Whatsapp ou E-mail." class="inputbox" style="clear: both; width: 400px; height: 35px;"/> </dt> <dd> </dd> </dl> <input type="hidden" name="message" /> <input type="hidden" name="mode" value="newtopic" /> <input type="hidden" name="f" /> <input type="hidden" name="lt" value="0" /> <span class="corners-bottom"><span></span></span> </fieldset> </div> </div> </div>  <div id="bts" style="display:none;" class="panel"> <div class="inner"><span class="corners-top"><span></span></span> <fieldset class="submit-buttons"><input id="bt-pr-questao" value="Pré-visualizar" type="button" class="button1"> <input id="bt-enviar" value="Enviar" type="button" class="button1" name="post"> <input id="bt-apagar" value="Apagar tudo" type="button" class="button1"> <input id="bt-enviar-e" value="Enviar" type="submit" class="button1" style="display:none;" name="post"></fieldset> <span class="corners-bottom"><span></span></span> </div> </div> </form> <div id="enviado" style="display:none;" class="panel"> <div class="inner"> <span class="corners-top"><span></span></span> <center> <img src="https://2img.net/i/fa/admin/wait_preview.gif" alt="carregando" title="enviado..." /><br /><span class="conteudo_texto">enviado...</span> </center><span class="corners-bottom"><span></span></span> </div> </div>

Obs: O enter ainda funciona em todos os campos, apenas não envia. Feliz

Até mais.

por TED_Junnior 28.09.19 19:29

O código resultou, muito obrigado.

por RafaelS. 28.09.19 23:52

Questão resolvida

Esta questão foi dada como resolvida pelo seu autor, e por esse motivo será marcada como resolvida e movida para o arquivo de questões resolvidas desta área.

Código para bloquear o enter em inputs