Ограничение входа к текстовому полю: разрешение только числа и десятичная точка
Когда я впервые начал изучать объектно-ориентированное программирование, я сделал легкую и, вероятно, общую ошибку использования наследования для совместного использования поведения, даже если это поведение не было существенным для характера объекта.
Для дальнейшего использования примера, используемого в этом конкретном вопросе, есть lots вещей, которые являются доступными - подруг, автомобили, нечеткие одеяла ... - поэтому у меня мог быть класс Petable, который предоставил это общее поведение и различные классы, наследующие от него.
Однако, будучи доступным, это не часть природы любого из этих объектов. Существуют гораздо более важные концепции, которые являются существенными для их природы - подруга - это человек, автомобиль - наземный транспорт, кошка - млекопитающее ...
Поведение должно сначала назначаться интерфейсам (включая интерфейс по умолчанию для класса) и продвигаться к базовому классу, только если они (а) являются общими для большой группы классов, которые являются подмножествами более крупного класса, - в том же смысле, что и «cat »и« человек »являются подмножествами« млекопитающих ».
Уловка, если вы понимаете объектно-ориентированный дизайн достаточно хорошо, чем я делал сначала, вы обычно делаете это автоматически, даже не задумываясь об этом , Таким образом, голая правда выражения «код для интерфейса, а не абстрактный класс» становится настолько очевидной, что вам трудно поверить, что кто-нибудь это захочет сказать - и начните читать другие значения.
Еще одна вещь, которую я бы добавил, это то, что если класс является чисто абстрактным - без не абстрактных, не наследуемых членов или методов, подверженных дочернему, родительскому или клиенту, - тогда почему это класс ? Его можно было бы заменить, в некоторых случаях интерфейсом, а в других случаях - Null.
5 ответов
Я принял решение заняться этим на oninput событие для обработки проблемы для вставки клавиатуры, вставки мыши и нажатий клавиш. Передайте TRUE или FALSE для указания на десятичную или целочисленную проверку.
Это - в основном три шага в трех лайнерах. Если Вы не хотите усекать десятичные числа, комментирует третий шаг. Корректировки к округлению могут быть внесены на третьем шаге также.
// Example Decimal usage;
// <input type="text" oninput="ValidateNumber(this, true);" />
// Example Integer usage:
// <input type="text" oninput="ValidateNumber(this, false);" />
function ValidateNumber(elm, isDecimal) {
try {
// For integers, replace everything except for numbers with blanks.
if (!isDecimal)
elm.value = elm.value.replace(/[^0-9]/g, '');
else {
// 1. For decimals, replace everything except for numbers and periods with blanks.
// 2. Then we'll remove all leading ocurrences (duplicate) periods
// 3. Then we'll chop off anything after two decimal places.
// 1. replace everything except for numbers and periods with blanks.
elm.value = elm.value.replace(/[^0-9.]/g, '');
//2. remove all leading ocurrences (duplicate) periods
elm.value = elm.value.replace(/\.(?=.*\.)/g, '');
// 3. chop off anything after two decimal places.
// In comparison to lengh, our index is behind one count, then we add two for our decimal places.
var decimalIndex = elm.value.indexOf('.');
if (decimalIndex != -1) { elm.value = elm.value.substr(0, decimalIndex + 3); }
}
}
catch (err) {
alert("ValidateNumber " + err);
}
}
inputelement.onchange= inputelement.onkeyup= function isnumber(e){
e= window.event? e.srcElement: e.target;
while(e.value && parseFloat(e.value)+''!= e.value){
e.value= e.value.slice(0, -1);
}
}
form.onsubmit = function(){
return textarea.value.match(/^\d+(\.\d+)?$/);
}
Это то, что вы ищете?
Надеюсь, это поможет.
EDIT: Я отредактировал свой пример выше, так что может быть только одна точка, которой предшествует хотя бы одна цифра, а за ней следует хотя бы одна цифра.
Вы ищете что-то вроде этого?
<HTML>
<HEAD>
<SCRIPT language=Javascript>
<!--
function isNumberKey(evt)
{
var charCode = (evt.which) ? evt.which : event.keyCode
if (charCode != 46 && charCode > 31 && (charCode < 48 || charCode > 57))
return false;
return true;
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<INPUT id="txtChar" onkeypress="return isNumberKey(event)" type="text" name="txtChar">
</BODY>
</HTML>