Блог

Главная - Вопросы по программированию - Принимает число только в редактируемом столбце td html

Принимает число только в редактируемом столбце td html

#javascript #html

#javascript #HTML

Вопрос:

У меня проблема с проверкой числа только в редактируемом столбце для моей таблицы. итак, вот мой HTML-код:

 <table>
<tr>
<td contenteditable='true' name="presentase"></td>
</tr>
</table>

и это мой js только для чисел:

 <script type="text/javascript">>
 $(".allow_only_numbers").keydown(function (e) {
            if ($.inArray(e.keyCode, [46, 8, 9, 27, 13, 110]) !== -1 ||
              ((e.keyCode == 65 || e.keyCode == 86 || e.keyCode == 67) amp;amp; (e.ctrlKey === true || e.metaKey === true)) ||
              (e.keyCode >= 35 amp;amp; e.keyCode <= 40)) {
                return;
            }
            if ((e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) amp;amp; (e.keyCode < 96 || e.keyCode > 105)) {
                e.preventDefault();
            }
        });
</script>

как сделать так, чтобы столбец мог вводить число только в этом теге «td». где я должен разместить «.allow_only_numbers» в теге столбца?

итак, помогите мне решить это. Спасибо

Комментарии:

1. может <input type='number' /> помочь вашему делу? Это лучше и экономит ваше время

2. Вы говорите о «редактируемом столбце», но в вашем HTML вы написали contenteditable='false' . Пожалуйста, исправьте или объясните подробнее.

3. извините, что я скопировал false, у меня также есть true.

Ответ №1:

Вы можете просто поместить allow_only_numbers класс в td

также ваш contenteditable должен быть true 

 $(".allow_only_numbers").keydown(function (e) {
            if ($.inArray(e.keyCode, [46, 8, 9, 27, 13, 110]) !== -1 ||
              ((e.keyCode == 65 || e.keyCode == 86 || e.keyCode == 67) amp;amp; (e.ctrlKey === true || e.metaKey === true)) ||
              (e.keyCode >= 35 amp;amp; e.keyCode <= 40)) {
                return;
            }
            if ((e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) amp;amp; (e.keyCode < 96 || e.keyCode > 105)) {
                e.preventDefault();
            }
        });  
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table border="1" width="100px" height="50px">
<tr>
<td class="allow_only_numbers" contenteditable='true' name="presentase"></td>
</tr>
</table>

Ответ №2:

вы даже можете использовать форматировщик в таблице, как приведенный ниже код, используя функцию для отображения значения в таблице

  <th data-field="DELETE_DOWNLOAD" data-align="center" data-formatter="deleteFileFormatter"></th>

где deleteFileFormatter — это функция, в которой значение, возвращаемое из функции, будет отправлено в таблицу