কীভাবে ধনাত্মক সংখ্যায় = "সংখ্যা" টাইপ করবেন


284

বর্তমানে আমি নিম্নলিখিত কোড আছে

<input type="number" />

এটি এর মত কিছু আসে

এখানে চিত্র বর্ণনা লিখুন

ডানদিকে ছোট নির্বাচনকারী জিনিসগুলি সংখ্যাটিকে negativeণাত্মক হতে দেয়। আমি কীভাবে এটি প্রতিরোধ করব?

আমার ব্যবহার সম্পর্কে সন্দেহ হচ্ছে type="number", এটি সমাধান হওয়ার চেয়ে আরও বেশি সমস্যার সৃষ্টি করছে, আমি যাইহোক এটি স্যানিটি পরীক্ষা করতে যাচ্ছি, তাই আমি কি কেবল ব্যবহারে ফিরে যাব type="text"?


4
আপনার এখনও সার্ভারে মানটি যাচাই করতে হবে। যে কেউ যাতে চান সামগ্রী পাঠাতে ক্ষেত্রটিকে ওভাররাইড করতে পারে।
zzzzBov

2
@zzzzBov হ্যাঁ, আমি এটি পিএইচপি দিয়ে বৈধতা দিয়েছি, এবং প্রস্তুত বিবৃতিও ব্যবহার করি, যারা বার্লি কীভাবে ওয়েব ব্রাউজার ব্যবহার করতে হয় তা জানেন যে ব্যবহারকারীরা চিন্তিত হন। তোমার
আর্য Faurtosh

উত্তর:


634

যোগ একটি minঅ্যাট্রিবিউট

<input type="number" min="0">


36
এটি নির্বাচক তীরগুলির জন্য কাজ করে তবে একটি নেতিবাচক সংখ্যা টাইপ করতে দেয়
ডেভিড বার্টন

2
বৈশিষ্ট্যটি পরিবর্তন min="0.000001"করা বেশিরভাগ ক্ষেত্রে সহায়তা করবে। 6 দশমিকেরও বেশি জায়গায়, জাভাস্ক্রিপ্ট এটিকে এক্সপোনেন্ট ফর্ম্যাটে রূপান্তর করবে।
মার্কএমইং

ডিফল্টরূপে, এটি কেবলমাত্র দশমিক নয়, পূর্ণসংখ্যার অনুমতি দেয়। দশমিক মান মঞ্জুরি দেওয়া দেখুন ।
str

118

নেতিবাচক সংখ্যা রোধ করার জন্য আমি আরও একটি সমাধান খুঁজে পেয়েছি।

<input type="number" name="test_name" min="0" oninput="validity.valid||(value='');">

আপনি এটি দিয়ে ভাসমান সংখ্যা যুক্ত করতে পারবেন না। এছাড়াও, সংখ্যা স্টিপার পাশাপাশি কাজ করে না এখানে।
হামজক্স

1
oninput="validity.valid||(value='');"একটি টাইপিং-ভী নম্বর থেকে থামায়
হ্যালো ইউনিভার্স

5
এটি বৈধ উত্তর হিসাবে চিহ্নিত করা উচিত যেহেতু এটি "-" অক্ষর টাইপ করতে বাধা দেয়
জ্যানব্রেস

আপনার যেমন ইতিবাচক, সম্পূর্ণ পূর্ণসংখ্যার সংখ্যা প্রয়োজন তেমন এটি দুর্দান্ত কাজ করে। ধন্যবাদ!
বরিস

74

এটি নির্ভর করে আপনি কতটা নির্ভুল হতে চান। এটির চেয়ে আপনি কেবলমাত্র পূর্ণসংখ্যা গ্রহণ করতে চান:

<input type="number" min="1" step="1">

আপনি যদি ভাসতে চান, উদাহরণস্বরূপ, দশমিক পয়েন্টের পরে দুটি অঙ্ক:

<input type="number" min="0.01" step="0.01">


এটি বর্তমানে একটি পদক্ষেপ = "1" ছাড়াই কাজ করে বলে মনে হচ্ছে ... আমি কি এখনও এটি যুক্ত করব?
আরিয়ান ফুর্তোষ

@ আরিয়ান আপনি যতক্ষণ maxমান নির্দিষ্ট না করে আপনি এটিকে বাদ দিতে পারেন ।
পাভলো

1
পদক্ষেপ 1 ব্রাউজারের ডিফল্ট, আপনি ভাল
স্টিফান মুলার

4
এটি এখনও খারাপ মানগুলিতে টাইপ করতে বাধা দেয় না - আপনি যদি পদক্ষেপের মান ক্রোম বাদ দেন তবে টাইপ করার সময় এটির বৈধতা হ্রাস করে যাতে আপনি অ-সংখ্যাসূচক মানগুলি প্রবেশ করতে পারেন। পদক্ষেপের সেট দিয়ে এটি আপনাকে সর্বনিম্ন সর্বাধিক সীমাটির বাইরে মানগুলি টাইপ করতে দেয় - এখনও ভুল, তবে আরও ভাল।
ডেভিড বার্টন

মিনিট = "1" পদক্ষেপ = "1" এখনও আমাকে 1.2 এর মতো ভাসমান সংখ্যা টাইপ করতে দেয় আমি কীভাবে কেবল পূর্ণসংখ্যাতে বাধ্য করতে পারি?
স্যাম

50

আপনি ট্যাগের onkeypressমধ্যে যোগ করে ইনপুটটিকে কেবল ধনাত্মক পূর্ণসংখ্যা রাখতে বাধ্য করতে পারেন input

<input type="number" onkeypress="return event.charCode >= 48" min="1" >

এখানে, event.charCode >= 480 টির চেয়ে বড় বা সমান সংখ্যকই ফিরে আসার বিষয়টি minনিশ্চিত করে , যখন ট্যাগটি নিশ্চিত করে যে ইনপুট বারের মধ্যে স্ক্রোল করে আপনি সর্বনিম্ন 1 এ আসতে পারেন।


3
এজতে আপনি এতে "এ" লিখতে পারেন।
অ্যামি

10
আপনি এখনও ঋণাত্মক সংখ্যা আটকে দিতে পারেন
মিথাইল

5

আপনি type="number"ইতিবাচক সংখ্যাগুলি গ্রহণ করতে নিম্নলিখিতটি ব্যবহার করতে পারেন :

input type="number" step="1" pattern="\d+"

2
আপনার বিবৃতিটি কী করে এবং কেন এটি সহায়তা করে তা ব্যাখ্যা করার চেষ্টা করতে পারেন? এছাড়াও, আপনার দুটি পৃথক স্নিপেট রয়েছে। কোনটি সঠিক?
এনাডন

2
পদক্ষেপের বৈশিষ্ট্য যুক্ত করে, আপনি পূর্ণসংখ্যায় ইনপুটকে সীমাবদ্ধ করেন এবং প্যাটার্নটি যুক্ত করে নিশ্চিত করে যে কোনও ভগ্নাংশের অংশ ব্যবহারের ক্ষেত্রটি অবৈধ হিসাবে চিহ্নিত হয়েছে তবে এটি ব্রাউজার বাস্তবায়নের উপর নির্ভর করে (ফায়ারফক্স ফোকাস হারাতে ইনপুটটির উপরে ক্ষেত্রটিকে লাল হিসাবে চিহ্নিত করে যেখানে ক্রোম দেয় না আপনি প্রথমে সম্মতিযুক্ত মানগুলি ইনপুট করেন)। একে সার্ভার / ক্লায়েন্টে বৈধ করা উচিত।
দীপালি

5

আপনি নিম্নলিখিত দ্বারা একটি সংখ্যা ইনপুট ফর্ম নেতিবাচক ইনপুট প্রতিরোধ করতে পারেন:

<input type="number" onkeyup="if(this.value<0){this.value= this.value * -1}">


3

চেষ্টা

<input type="number" pattern="^[0-9]" title='Only Number' min="1" step="1">


আপনি যখন কোনও ধরণের সংজ্ঞা দেন তখন ভূমিকার জন্য আপনার নির্দিষ্ট বিন্যাসের প্রয়োজন হয়।
রোজারিও ডি মোরেস

7
ক্রোমে এটি চেষ্টা করেছিলেন, এবং এটি প্যাটার্নটি প্রয়োগ করে না
ডেভিড বার্টন

এমন কোনও উপায় আছে যে আমি যদি "সংখ্যার" পরিবর্তে টাইপ = "পাঠ্য" যুক্ত করি?
কপিল ভার্মা

1

যদি পাঠ্য ইনপুট প্রয়োজন হয় , প্যাটার্নটিও কাজ করে

<input type="text" pattern="\d+">

1

ইনপুট করার জন্য কিছু কাজ হিসাবে অনুলিপি সমাধান খুঁজে পাচ্ছি না তবে অনুলিপি এবং পেস্টের জন্য নয়, কিছু অন্য উপায়। এই সমাধানটি আমার পক্ষে কাজ করে। এটি নেতিবাচক নম্বর থেকে "ই" টাইপ করে, "ই" পাঠ্যটি অনুলিপি করে আটকান।

একটি ফাংশন তৈরি করুন।

<script language="JavaScript">

  // this prevents from typing non-number text, including "e".
  function isNumber(evt) {
    evt = (evt) ? evt : window.event;
    let charCode = (evt.which) ? evt.which : evt.keyCode;
    if ((charCode > 31 && (charCode < 48 || charCode > 57)) && charCode !== 46) {
      evt.preventDefault();
    } else {
      return true;
    }
  }
</script>

ইনপুট এই বৈশিষ্ট্য যুক্ত করুন। এই দুটি "ই" সহ নন-সংখ্যা পাঠ্য অনুলিপি করে আটকাতে বাধা দেয় prevent কার্যকর করতে আপনার উভয়কে একসাথে করা দরকার।

<input type="number" oninput="validity.valid||(value='');" onpress="isNumber(event)" />

আপনি যদি ভ্যু ব্যবহার করছেন তবে আপনি এই উত্তরটি এখানে উল্লেখ করতে পারেন । আমি এটি একটি মিশ্রণে বের করেছি যা পুনরায় ব্যবহার করা যেতে পারে।


0

আপনার ইনপুট প্রকারে এই কোড যুক্ত করুন;

onkeypress="return (event.charCode == 8 || event.charCode == 0 || event.charCode == 13) ? null : event.charCode >= 48 && event.charCode <= 57"

উদাহরণ স্বরূপ:

<input type="text" name="age" onkeypress="return (event.charCode == 8 || event.charCode == 0 || event.charCode == 13) ? null : event.charCode >= 48 && event.charCode <= 57" />

1
এটি সত্যিই বিভ্রান্তিকর যে কেউ কি ঘটছে বুঝতে পারে না।
রোজএ

এইভাবে, আপনি এখনও ইনপুট, বর্ণমালা বা এমনকি বিশেষ চরিত্রগুলিতে কোনও কিছু আটকে দিতে পারেন
Lê Gia Lễ

0

অন্যান্য সমাধানটি জেএসকে ইতিবাচক করে তোলার জন্য ব্যবহার করা হয় (ব্যবহারকারীর স্মিথ করার সময় ন্যূনতম বিকল্পটি অক্ষম করা যায় এবং এটি বৈধ নয়) প্রয়োজনে নেতিবাচক প্রয়োজন নেই এবং ('কীডাউন') ইভেন্টটিও ব্যবহার করা যেতে পারে!

let $numberInput =  $('#whatEverId');
$numberInput.on('change', function(){
    let numberInputText = $numberInput.val();
    if(numberInputText.includes('-')){
        $numberInput.val(Math.abs($numberInput.val()));
    }
});

0

এটি নির্ভর করে আপনি কোনও ইনট বা ভাসমান ক্ষেত্র চান কিনা তার উপর নির্ভর করে। এখানে দু'জনের দেখতে কেমন:

<input type="number" name="int-field" id="int-field" placeholder="positive int" min="1" step="1">
<input type="number" name="float-field" id="float-field" placeholder="positive float" min="0">

অন্তর্নিহিত ক্ষেত্রটির সাথে সঠিক বৈধতা যুক্ত রয়েছে, যেহেতু এটির মিনিট 1 is তবে ভাসমান ক্ষেত্র 0 টি গ্রহণ করে; এটি মোকাবেলা করতে, আপনি আরও একটি বাধা যাচাইকারী যুক্ত করতে পারেন :

function checkIsPositive(e) {
  const value = parseFloat(e.target.value);
  if (e.target.value === "" || value > 0) {
    e.target.setCustomValidity("");
  } else {
    e.target.setCustomValidity("Please select a value that is greater than 0.");
  }
}

document.getElementById("float-field").addEventListener("input", checkIsPositive, false);

জেএসফিডেল এখানে।

নোট করুন যে এই সমাধানগুলির কোনওটিই অবৈধ ইনপুট টাইপ করার চেষ্টা থেকে ব্যবহারকারীকে সম্পূর্ণরূপে বাধা দেয় না, তবে আপনি কল করতে পারেন checkValidityবাreportValidity ব্যবহারকারী বৈধ ইনপুটটি টাইপ করেছেন কিনা তা নির্ধারণ ।

অবশ্যই, আপনার এখনও সার্ভার-সাইড বৈধতা থাকা উচিত কারণ ব্যবহারকারী সর্বদা ক্লায়েন্ট-সাইডের বৈধতা উপেক্ষা করতে পারে।


0

এটা চেষ্টা কর:

  • কৌনিক 8 এ পরীক্ষিত
  • মান ধনাত্মক হয়
  • এই কোডটি হ্যান্ডেলগুলি nullএবং মানগুলিও দেয় negitive
              <input
                type="number"
                min="0"
                (input)="funcCall()" -- Optional
                oninput="value == '' ? value = 0 : value < 0 ? value = value * -1 : false"
                formControlName="RateQty"
                [(value)]="some.variable" -- Optional
              />

0

আপনি যদি কোনও নেতিবাচক সংখ্যা প্রবেশ করার চেষ্টা করেন তবে অনকিআপ ইভেন্ট এটিকে অবরুদ্ধ করে এবং আপনি যদি ইনপুট নম্বরটিতে তীর ব্যবহার করেন তবে অন্বলুর ইভেন্টটি সেই অংশটি সমাধান করে।

<input type="number" 
    onkeyup="if(this.value<0)this.value=1"
    onblur="if(this.value<0)this.value=1"
>



-2

পাঠ্যের ধরণের ইনপুট দিয়ে আপনি এটি আরও ভাল বৈধতার জন্য ব্যবহার করতে পারেন,

return (event.keyCode? (event.keyCode == 69 ? false : event.keyCode >= 48 && event.keyCode <= 57) : (event.charCode >= 48 && event.charCode <= 57))? true : event.preventDefault();

-4

এটা চেষ্টা কর:

Yii2 : Validation rule 

    public function rules() {
    return [
['location_id', 'compare', 'compareValue' => 0', 'operator' => '>'],
        ];
}
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.