जवाबों:
इस तरह की minविशेषता का उपयोग करें:
<input type="number" min="0">मैं @ जवाब के साथ संतुष्ट नहीं था क्योंकि:
यह केवल नकारात्मक संख्याओं को ऊपर / नीचे तीर से प्रवेश करने से रोक रहा था, जबकि उपयोगकर्ता कीबोर्ड से नकारात्मक संख्या टाइप कर सकता है।
समाधान कुंजी कोड के साथ रोकने के लिए है :
// Select your input element.
var number = document.getElementById('number');
// Listen for input event on numInput.
number.onkeydown = function(e) {
if(!((e.keyCode > 95 && e.keyCode < 106)
|| (e.keyCode > 47 && e.keyCode < 58)
|| e.keyCode == 8)) {
return false;
}
}<form action="" method="post">
<input type="number" id="number" min="0" />
<input type="submit" value="Click me!"/>
</form>@ हेग गुनी द्वारा प्रदान किया गया स्पष्टीकरण :
किन प्रमुख कोड की जाँच की जा रही है:
इसलिए यह स्क्रिप्ट अमान्य कुंजी को इनपुट में दर्ज होने से रोक रही है।
min="0"।
|| (e.keyCode>36 && e.keyCode<41)यह उपयोगकर्ता को ऊपर / नीचे तीर के माध्यम से संख्या को बढ़ाने / घटाने की अनुमति नहीं देता है और संख्या को संपादित करने के लिए दाएं / बाएं जाता है।
मेरे लिए समाधान था:
<input type="number" min="0" oninput="this.value = Math.abs(this.value)"><input ng-model="row.myValue" type="{{row.code == 1 ? 'text' : 'number'}}" min="0" ng-pattern="..." noformvalidate oninput="if (this.type=='text') this.value=Math.abs(this.value) ">
यह कोड मेरे लिए ठीक काम कर रहा है। क्या तुम इसे जांचोगे:
<input type="number" name="test" min="0" oninput="validity.valid||(value='');">-वास्तव में एक अच्छा विचार नहीं है।
<input type="number" name="test" min="0" oninput="validity.valid||(value=value.replace(/\D+/g, ''))">- यह सभी गैर-अंकों के प्रतीकों को हटा देगा
min="0"इसलिए कोई नगेटिव नहीं हैं। यदि आप ऋणात्मक मान चाहते हैं तो इस विशेषता को हटा दें।
आसान विधि:
<input min='0' type="number" onkeypress="return (event.charCode == 8 || event.charCode == 0) ? null : event.charCode >= 48 && event.charCode <= 57">मैं दशमलव संख्याओं की अनुमति देना चाहता था और यदि नकारात्मक इनपुट किया गया था तो पूरे इनपुट को साफ़ नहीं करना चाहिए। यह क्रोम में कम से कम काम करता है:
<input type="number" min="0" onkeypress="return event.charCode != 45">keypressही एक इनपुट में एक नकारात्मक संख्या में प्रवेश कर सकता है एक ही रास्ता है ...
@ मैनवाल उत्तर अच्छा है, लेकिन मुझे बेहतर पठनीयता के लिए कोड की कम लाइनों वाला कोड पसंद है। इसके बजाय मैं html में onclick / onkeypress उपयोग का उपयोग करना पसंद करता हूं।
मेरा सुझाव दिया समाधान भी यही करता है: जोड़ें
min="0" onkeypress="return isNumberKey(event)"html इनपुट और
function isNumberKey(evt){
var charCode = (evt.which) ? evt.which : event.keyCode;
return !(charCode > 31 && (charCode < 48 || charCode > 57));
}एक जावास्क्रिप्ट फ़ंक्शन के रूप में।
जैसा कहा गया, वैसा ही करता है। यह समस्या को हल करने के तरीके पर सिर्फ व्यक्तिगत प्राथमिकता है।
केवल संदर्भ के लिए: jQuery के साथ आप निम्न कोड के साथ फ़ोकआउट पर नकारात्मक मानों को अधिलेखित कर सकते हैं:
$(document).ready(function(){
$("body").delegate('#myInputNumber', 'focusout', function(){
if($(this).val() < 0){
$(this).val('0');
}
});
});यह सर्वर साइड सत्यापन को प्रतिस्थापित नहीं करता है!
यहाँ एक कोणीय 2 समाधान है:
केवल एक कक्षा बनाएँ
import {Directive, ElementRef, HostListener} from '@angular/core';
@Directive({
selector: '[OnlyNumber]'
})
export class OnlyNumber {
// Allow decimal numbers. The \. is only allowed once to occur
private regex: RegExp = new RegExp(/^[0-9]+(\.[0-9]*){0,1}$/g);
// Allow key codes for special events. Reflect :
// Backspace, tab, end, home
private specialKeys: Array<string> = ['Backspace', 'Tab', 'End', 'Home'];
constructor(private el: ElementRef) {
}
@HostListener('keydown', ['$event'])
onKeyDown(event: KeyboardEvent) {
// Allow Backspace, tab, end, and home keys
if (this.specialKeys.indexOf(event.key) !== -1) {
return;
}
// Do not use event.keycode this is deprecated.
// See: https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/keyCode
let current: string = this.el.nativeElement.value;
// We need this because the current value on the DOM element
// is not yet updated with the value from this event
let next: string = current.concat(event.key);
if (next && !String(next).match(this.regex)) {
event.preventDefault();
}
}
}App.module.ts में घोषणाओं में केवल OneNumber जोड़ें और अपने ऐप में कहीं भी इस तरह का उपयोग करें
<input OnlyNumber="true">oninput="this.value=(this.value < Number(this.min) || this.value > Number(this.max)) ? '' : this.value;"बस ऐसा करने का एक और तरीका जोड़ना (कोणीय का उपयोग करना)यदि आप HTML को और अधिक कोड के साथ नहीं धोना चाहते हैं, तो :
आपको केवल फ़ील्ड वैल्यू सब्सक्राइब करना होगा और वैल्यू को एक निरपेक्ष मान के रूप में सेट करना होगा (किसी नए ईवेंट को न छोड़ने का ध्यान रखना क्योंकि इससे एक और वैल्यू चेंज हो जाएगा, इसलिए एक रिकर्सिव कॉल और एक अधिकतम कॉल आकार को ट्रिगर कर दिया गया है)
HTML कोड
<form [formGroup]="myForm">
<input type="number" formControlName="myInput"/>
</form>टाइपस्क्रिप्ट CODE (आपके घटक के अंदर)
formGroup: FormGroup;
ngOnInit() {
this.myInput.valueChanges
.subscribe(() => {
this.myInput.setValue(Math.abs(this.myInput.value), {emitEvent: false});
});
}
get myInput(): AbstractControl {
return this.myForm.controls['myInput'];
}<input type="number" name="credit_days" pattern="[^\-]+"
#credit_days="ngModel" class="form-control"
placeholder="{{ 'Enter credit days' | translate }}" min="0"
[(ngModel)]="provider.credit_days"
onkeypress="return (event.charCode == 8 || event.charCode == 0 ||
event.charCode == 13) ? null : event.charCode >= 48 && event.charCode <=
57" onpaste="return false">इसका उत्तर सहायक नहीं है। जब आप अप / डाउन कीज का उपयोग करते हैं तो यह केवल काम करता है, लेकिन यदि आप -11 टाइप करते हैं तो यह काम नहीं करेगा। तो यहाँ एक छोटा सा फिक्स है जो मैं उपयोग करता हूं
पूर्णांकों के लिए यह एक है
$(".integer").live("keypress keyup", function (event) {
// console.log('int = '+$(this).val());
$(this).val($(this).val().replace(/[^\d].+/, ""));
if (event.which != 8 && (event.which < 48 || event.which > 57))
{
event.preventDefault();
}
});यह एक जब आपके पास मूल्य की संख्या होती है
$(".numeric, .price").live("keypress keyup", function (event) {
// console.log('numeric = '+$(this).val());
$(this).val($(this).val().replace(/[^0-9\,\.]/g, ''));
if (event.which != 8 && (event.which != 44 || $(this).val().indexOf(',') != -1) && (event.which < 48 || event.which > 57)) {
event.preventDefault();
}
});यह समाधान कीबोर्ड के साथ कॉपी पेस्ट सहित सभी कीबोर्ड कार्यक्षमता की अनुमति देता है। यह माउस के साथ ऋणात्मक संख्याओं को चिपकाने से रोकता है। यह सभी ब्राउज़रों और कोडपेन पर डेमो के साथ काम करता है बूटस्ट्रैप और jQuery का उपयोग करता है। यह गैर अंग्रेजी भाषा सेटिंग्स और कीबोर्ड के साथ काम करना चाहिए। यदि ब्राउज़र पेस्ट इवेंट कैप्चर (IE) का समर्थन नहीं करता है, तो यह फ़ोकस आउट के बाद नकारात्मक चिह्न को हटा देगा। यह समाधान मूल ब्राउज़र के रूप में व्यवहार करता है जिसे मिन = 0 प्रकार = संख्या के साथ होना चाहिए।
मार्कअप:
<form>
<input class="form-control positive-numeric-only" id="id-blah1" min="0" name="nm1" type="number" value="0" />
<input class="form-control positive-numeric-only" id="id-blah2" min="0" name="nm2" type="number" value="0" />
</form>जावास्क्रिप्ट
$(document).ready(function() {
$("input.positive-numeric-only").on("keydown", function(e) {
var char = e.originalEvent.key.replace(/[^0-9^.^,]/, "");
if (char.length == 0 && !(e.originalEvent.ctrlKey || e.originalEvent.metaKey)) {
e.preventDefault();
}
});
$("input.positive-numeric-only").bind("paste", function(e) {
var numbers = e.originalEvent.clipboardData
.getData("text")
.replace(/[^0-9^.^,]/g, "");
e.preventDefault();
var the_val = parseFloat(numbers);
if (the_val > 0) {
$(this).val(the_val.toFixed(2));
}
});
$("input.positive-numeric-only").focusout(function(e) {
if (!isNaN(this.value) && this.value.length != 0) {
this.value = Math.abs(parseFloat(this.value)).toFixed(2);
} else {
this.value = 0;
}
});
});यहाँ एक समाधान है जो मुझे एक क्यूटीवाई क्षेत्र के लिए सबसे अच्छा काम करता है जो केवल संख्या की अनुमति देता है।
// Only allow numbers, backspace and left/right direction on QTY input
if(!((e.keyCode > 95 && e.keyCode < 106) // numpad numbers
|| (e.keyCode > 47 && e.keyCode < 58) // numbers
|| [8, 9, 35, 36, 37, 39].indexOf(e.keyCode) >= 0 // backspace, tab, home, end, left arrow, right arrow
|| (e.keyCode == 65 && (e.ctrlKey === true || e.metaKey === true)) // Ctrl/Cmd + A
|| (e.keyCode == 67 && (e.ctrlKey === true || e.metaKey === true)) // Ctrl/Cmd + C
|| (e.keyCode == 88 && (e.ctrlKey === true || e.metaKey === true)) // Ctrl/Cmd + X
|| (e.keyCode == 86 && (e.ctrlKey === true || e.metaKey === true)) // Ctrl/Cmd + V
)) {
return false;
}If Number is Negative or Positive Using ES6’s Math.Sign
const num = -8;
// Old Way
num === 0 ? num : (num > 0 ? 1 : -1); // -1
// ES6 Way
Math.sign(num); // -1