нажмите следующую кнопку внутри таблицы, когда нажмите Enter - PullRequest
Новая
       38

нажмите следующую кнопку внутри таблицы, когда нажмите Enter

0 голосов
/ 25 апреля 2020

У меня есть таблица с входом и кнопкой рядом с ней.

соответствующая кнопка должна быть нажата при нажатии на вход enter. 

$('.inputs').keydown(function (e) {
    if (e.which === 13) {
     $(this).find('.btn').click(function() {
       alert( "clicked" );
      });
    }
});

jsfiddle

Ответы [ 2 ]

2 голосов
/ 25 апреля 2020

Проблема здесь заключается в Вводе нажатия клавиш. Вы фактически добавляете список событий click, но не нажимаете кнопку. Вы можете исправить это, поместив прослушиватель событий click снаружи и при вводе просто вызвать это событие.

Кроме того, 

$(this).find('.btn')

logi c не так, как .inputs внутри td и .btn внутри другого td, поэтому выполнение $(this).find('.btn') вообще ничего не дает, так как внутри элемента .inputs нет элемента .btn.

Вы можете использовать это вместо этого: 

$(this).closest('tr').find('.btn')

Это найдет строку таблицы closest tr для текущего элемента .inputs, а затем найдет элемент .btn внутри этой строки, используя .find('.btn').

Демо: 

$('.inputs').keydown(function(e) {
  if (e.which === 13) {
    $(this).closest('tr').find('.btn').click()
  }
});

$('.half').on('click', '.btn', function() {
  alert("clicked");
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table class="half">
  <tr>
    <td>
      <input class="inputs" name="ragsoc" type="text" class="text-sx" id="ragsoc" value="" />
    </td>
    <td class="tdocra c_white b"><a href="" class="btn">BUTTON</a></td>
  </tr>
  <tr>
    <td>
      <input class="inputs" name="ragsoc" type="text" class="text-sx" id="ragsoc" value="" />
    </td>
    <td class="tdocra c_white b"><a href="" class="btn">BUTTON</a></td>
  </tr>
  <tr>
    <td>
      <input class="inputs" name="ragsoc" type="text" class="text-sx" id="ragsoc" value="" />
    </td>
    <td class="tdocra c_white b"><a href="" class="btn">BUTTON</a></td>
  </tr>
</table>
0 голосов
/ 25 апреля 2020

Вы можете использовать одну функцию, которая вызывается, если нажата кнопка ввода ИЛИ нажата кнопка? 

function doSomething(){
  alert('clicked');
}

$('.inputs').keydown(function (e) {
    if (e.which === 13) {
     doSomething();
});

$(".btn").click(function(e){
  e.preventDefault();
  doSomething();
}
...