Tengo dos cuadros de texto diferentes (procedentes del bucle). En este momento, los datos se envían con el evento "clic". Pero ahora también quiero "Publicar" datos después del botón "ingresar" (por ejemplo, comentarios de Facebook). ¿Cómo puedo hacer esto?
Aquí está mi código
foreach ... { <!-- First text box --> <input type="text" placeholder="Post your comment here" id="txt'.$FeedId.'" class="feed_in_input" name=""> <img class="feed_reply_smiley2" data-coin='.$CoinId.' data-max2='.$postID.' data-min2='.$postID.' data-stat='.$PostStatus.' id="button'.$FeedId.'" src="'.base_url().'/assets/social/images/feed_reply_smiley.svg" alt="img"> <!-- Second text box --> <input type="text" placeholder="Reply to '.$UserName.'" id="txt'.$FeedId.'" class="feed_in_input" name=""> <img class="feed_reply_smiley" id="button'.$FeedId.'" src="'.base_url().'/assets/social/images/feed_reply_smiley.svg" alt="img"> }Aquí está mi guión
$('.feed_reply_smiley2').unbind().click(function(e) { //our code here }); $('.feed_reply_smiley').unbind().click(function(e) { //our code here });Solo quiero que cada vez que el usuario presione el botón "ingresar" en cualquier cuadro de texto, la función debería ejecutarse igual que trabajar en el evento "hacer clic". ¿Cómo puedo hacer esto?
Agregue todo dentro de una etiqueta de formulario, después de lo cual puede detectar el envío del formulario
<script> function myfunction(e) { e.preventDefault(); alert("yes"); } </script> <form method="post" onsubmit="myfunction(event)"> <input name="something" /> <input type="submit" /> </form>preventDefault evitará el comportamiento predeterminado de envío de datos
Aquí hay un ejemplo de cómo manejar la entrada en una entrada de texto. En tu caso:
$('.feed_in_input').on('keyup', function(event) { if (event.keyCode == 13) { // 13 = Enter Key alert('enter key pressed.'); } });A continuación, si su objetivo es activar el mismo código desde varios eventos diferentes, el primer paso es configurar ese código como una función invocable. Por ejemplo:
function handleClickAndEnter() { // our code here alert('Action happened!'); }Ahora puede llamar a esa función desde cada uno de sus controladores, por ejemplo:
$('.feed_reply_smiley').on('click', handleClickAndEnter); $('.feed_reply_smiley2').on('click', handleClickAndEnter); $('.feed_in_input').on('keyup', function(event) { if (event.keyCode == 13) { // 13 = Enter Key handleClickAndEnter(); } });También puede combinar los primeros 2 controladores en uno si lo desea:
$('.feed_reply_smiley, .feed_reply_smiley2').on('click', handleClickAndEnter);Si su código necesita determinar qué evento se activó, debe ir un poco más allá. Haga clic en "Ejecutar fragmento de código" para ver cómo funciona todo.
$('.feed_in_input').on('keyup', function(event) { if (event.keyCode == 13) { // Pass the event along to the handler handleClickAndEnter(event); } }); $('.feed_reply_smiley, .feed_reply_smiley2').on('click', function(event) { // Pass the event along to the handler handleClickAndEnter(event) }); // Now accept the event as a parameter function handleClickAndEnter(event) { // our code here if (event.target.nodeName == "INPUT") { alert('Someone hit enter!'); } else if (event.target.nodeName == "IMG") { alert('Someone clicked an image!'); } } <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> Input 1: <input class="feed_in_input" type="text"> <br><img src="https://via.placeholder.com/350x65" class="feed_reply_smiley"> <br><br>Input 2:<input class="feed_in_input" type="text"> <br><img src="https://via.placeholder.com/350x65" class="feed_reply_smiley2">