Обход ячеек таблицы jQuery

Question

Я видел много похожих постов, но здесь у меня ничего не работает.Итак, я пытаюсь проверять данные ввода при каждом нажатии клавиши и показывать ошибку в следующем div (в следующей ячейке), пробовал много комбинаций обхода, но не повезло.

Код указан ниже: -

$(this).keypress( function() {
//alert(this);
if (($(this).val().length < 5)||($(this).val().length > 20)) // maybe not working
$(this).parent('td').next('td').children('div').text("Error"); // <- not working
// check input for validity here
});

Таблица: -

<table width="1032" height="448" align="center" cellpadding="1" cellspacing="0">
  <tr>
   <th width="153" align="right" scope="row"><strong>Name:</strong></th>
    <td width="420">
      <label for="user_name"></label>
     <input name="user_name" type="text" id="user_name" size="70" maxlength="100" value="<?php if (isset($row))  echo $row[1]; ?>"/>

   </td>
   <td width="451"> 
    <div id="div_user_name"></div>
   </td>
  </tr>
</table>

Answer 1

Предполагая, что $(this) фактически выбирает ваш элемент input, вам также необходимо настроить оператор if, чтобы проверить значение длины полей ввода, а не длиныселектора:

if (($(this).val().length < 5) || ($(this).val().length > 20))

Также я предполагаю, что у вас есть этот селектор вокруг вашего текущего кода скрипта:

$("input[type='text']").each(function(){

   $(this).keypress( function() {
   ...
   });

});

Вот jsfiddle вашего кодас моим входом ... работает ...