এইচটিএমএল 5 নম্বর ইনপুট - সর্বদা 2 দশমিক স্থান প্রদর্শন করুন

Question 1

input[type='number']সর্বদা 2 দশমিক স্থান দেখানোর জন্য কোনও মান বিন্যাস করার কোনও উপায় আছে কি ?

উদাহরণ: আমি এর 0.00পরিবর্তে দেখতে চাই 0।

Question 2

আপনি সত্যিই পারবেন না, তবে আপনি অর্ধেক ধাপ হতে পারেন:

<input type='number' step='0.01' value='0.00' placeholder='0.00' />

স্নিপেট প্রসারিত করুন

Question 3

ইঙ্গিতগুলিতে ফর্ম্যাটটি জোর করতে পরামর্শগুলি অনুসরণ করে এবং jQuery এর একটি অংশ যুক্ত করে সমাধান করা:

parseFloat($(this).val()).toFixed(2)

Question 4

ব্যবহার stepঅ্যাট্রিবিউট এটি সক্রিয় হবে । এটি কেবল নির্ধারণ করে না যে এটি কতটা চক্রের কথা বলেছিল তা নয়, তবে অনুমোদিত নম্বরও। ব্যবহারের কৌশলটি করা step="0.01" উচিত তবে এটি ব্রাউজারটি কীভাবে মানকে মেনে চলে তার উপর নির্ভর করে।

<input type='number' step='0.01' value='5.00'>

স্নিপেট প্রসারিত করুন

Question 5

সমাধানগুলি input="number" step="0.01"ক্রোমে আমার জন্য দুর্দান্ত কাজ করে তবে কিছু ব্রাউজারে কাজ করে না, বিশেষত আমার ক্ষেত্রে ফ্রন্টমোশন ফায়ারফক্স 35 ... যা আমাকে সমর্থন করতে হবে।

আমার সমাধানটি ইগোর এসকোবারের জিকুয়েরি মাস্ক প্লাগইনটির সাথে jQuery ছিল, নিম্নরূপ:

<script src="/your/path/to/jquery-mask.js"></script>
<script>
    $(document).ready(function () {
        $('.usd_input').mask('00000.00', { reverse: true });
    });
</script>

<input type="text" autocomplete="off" class="usd_input" name="dollar_amt">

এটি ভালভাবে কাজ করে অবশ্যই অবশ্যই জমা দেওয়া মানটি পরে পরীক্ষা করা উচিত :) দ্রষ্টব্য, যদি আমার ব্রাউজারের সামঞ্জস্যের জন্য এটি না করতে হয় তবে আমি উপরের উত্তরটি @ রিচ ব্র্যাডশো ব্যবহার করব।

Question 6

@ গুয়েলহেরেম ফেরেরির এই উত্তরের ভিত্তিতে আপনি parseFloatপ্রতিবার ক্ষেত্র পরিবর্তনের সাথে সাথে পদ্ধতিটি ট্রিগার করতে পারবেন । সুতরাং ব্যবহারকারী সর্বদা দুটি দশমিক স্থান দেখায়, এমনকি যদি কোনও ব্যবহারকারী কোনও সংখ্যা ম্যানুয়াল টাইপ করে মান পরিবর্তন করে।

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $(".floatNumberField").change(function() {
            $(this).val(parseFloat($(this).val()).toFixed(2));
        });
    });
</script>

<input type="number" class="floatNumberField" value="0.00" placeholder="0.00" step="0.01" />

স্নিপেট প্রসারিত করুন

Question 7

এটি ব্যবহারকারী টাইপিং শেষ না করে যদি স্বয়ংক্রিয়ভাবে ২ টি জায়গায় গোল না করে সর্বাধিক 2 দশমিক স্থান প্রয়োগ করতে কাজ করে।

function naturalRound(e) {

   let dec = e.target.value.indexOf(".")
   let tooLong = e.target.value.length > dec + 3
   let invalidNum = isNaN(parseFloat(e.target.value))

   if ((dec >= 0 && tooLong) || invalidNum) {
     e.target.value = e.target.value.slice(0, -1)
   }
}

Question 8

আপনি যদি এখানে অবতরণ করেন তবে কীভাবে 2 দশমিক স্থানে সীমাবদ্ধ করতে হবে তা নিয়ে আমার কাছে একটি স্থানীয় জাভাস্ক্রিপ্ট সমাধান রয়েছে:

জাভাস্ক্রিপ্ট:

function limitDecimalPlaces(e, count) {
  if (e.target.value.indexOf('.') == -1) { return; }
  if ((e.target.value.length - e.target.value.indexOf('.')) > count) {
    e.target.value = parseFloat(e.target.value).toFixed(count);
  }
}

এইচটিএমএল:

<input type="number" oninput="limitDecimalPlaces(event, 2)" />

নোট করুন যে এটি এএএআইএকে, নম্বর ইনপুট সহ এই ক্রোম বাগের বিরুদ্ধে রক্ষা করতে পারে না ।

Question 9

আমি জানি এটি একটি পুরানো প্রশ্ন, তবে আমার কাছে মনে হয় যে এই উত্তরগুলির কোনওটিরই প্রশ্নের উত্তর জিজ্ঞাসা করা হয়নি বলে আশা করি আশা করি এটি ভবিষ্যতে কাউকে সহায়তা করবে।

হ্যাঁ আপনি সর্বদা 2 দশমিক স্থান প্রদর্শন করতে পারেন, তবে দুর্ভাগ্যক্রমে এটি একমাত্র উপাদান বৈশিষ্ট্যগুলি দিয়ে করা যায় না, আপনাকে জাভাস্ক্রিপ্ট ব্যবহার করতে হবে।

আমার উল্লেখ করা উচিত এটি বৃহত সংখ্যার জন্য আদর্শ নয় কারণ এটি সর্বদা পিছনের জিরোগুলিকে বাধ্য করবে, সুতরাং ব্যবহারকারীকে 9.99 এর চেয়ে বেশি মান নির্ধারণের জন্য অক্ষর মুছে ফেলার পরিবর্তে কার্সারটি ফিরে যেতে হবে

//Use keyup to capture user input & mouse up to catch when user is changing the value with the arrows
    $('.trailing-decimal-input').on('keyup mouseup', function (e) {

        // on keyup check for backspace & delete, to allow user to clear the input as required
        var key = e.keyCode || e.charCode;
        if (key == 8 || key == 46) {
            return false;
        };

        // get the current input value
        let correctValue = $(this).val().toString();

         //if there is no decimal places add trailing zeros
        if (correctValue.indexOf('.') === -1) {
            correctValue += '.00';
        }

        else {

            //if there is only one number after the decimal add a trailing zero
            if (correctValue.toString().split(".")[1].length === 1) {
                correctValue += '0'
            }

            //if there is more than 2 decimal places round backdown to 2
            if (correctValue.toString().split(".")[1].length > 2) {
                correctValue = parseFloat($(this).val()).toFixed(2).toString();
            }
        }

        //update the value of the input with our conditions
        $(this).val(correctValue);
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="my-number-input" class="form-control trailing-decimal-input" type="number" min="0.01" step="0.01" value="0.00" />

স্নিপেট প্রসারিত করুন

Question 10

এটি .toFixed(2)দুটি দশমিক জায়গার জন্য ফাংশনটি ব্যবহার করে JQuery এ একটি দ্রুত বিন্যাসক ।

<input class="my_class_selector" type='number' value='33'/>


// if this first call is in $(document).ready() it will run
// after the page is loaded and format any of these inputs

$(".my_class_selector").each(format_2_dec);
function format_2_dec() {
    var curr_val = parseFloat($(this).val());
    $(this).val(curr_val.toFixed(2));
}

কনস: আপনাকে প্রতিবার ইনপুট নম্বরটি পুনরায় ফর্ম্যাট করতে পরিবর্তন করতে হবে।

// listener for input being changed
$(".my_class_selector").change(function() {
    // potential code wanted after a change

    // now reformat it to two decimal places
    $(".my_class_selector").each(format_2_dec);
});

দ্রষ্টব্য: কোনও কারণে যদি কোনও ইনপুট 'সংখ্যা' টাইপের হয় তবে jQuery val()একটি স্ট্রিং প্রদান করে। অতএব parseFloat()।

Question 11

শীর্ষের উত্তরটি আমাকে সমাধানটি দিয়েছিল তবে আমি পছন্দ করি না যে ব্যবহারকারীর ইনপুটটি তাত্ক্ষণিকভাবে পরিবর্তিত হয়েছিল তাই আমি দেরি করেছি যা আমার মতে আরও ভাল ব্যবহারকারীর অভিজ্ঞতায় অবদান রাখে

var delayTimer;
function input(ele) {
    clearTimeout(delayTimer);
    delayTimer = setTimeout(function() {
       ele.value = parseFloat(ele.value).toFixed(2).toString();
    }, 800); 
}

<input type='number' oninput='input(this)'>

স্নিপেট প্রসারিত করুন

https://jsfiddle.net/908rLhek/1/

Question 12

আমার পছন্দের পদ্ধতির, যা dataসংখ্যার স্থিতি ধরে রাখতে বৈশিষ্ট্যগুলি ব্যবহার করে:

<input type='number' step='0.01'/>

// react to stepping in UI
el.addEventListener('onchange', ev => ev.target.dataset.val = ev.target.value * 100)

// react to keys
el.addEventListener('onkeyup', ev => {

    // user cleared field
    if (!ev.target.value) ev.target.dataset.val = ''

    // non num input
    if (isNaN(ev.key)) {

        // deleting
        if (ev.keyCode == 8)

            ev.target.dataset.val = ev.target.dataset.val.slice(0, -1)

    // num input
    } else ev.target.dataset.val += ev.key

    ev.target.value = parseFloat(ev.target.dataset.val) / 100

})

Question 13

import { Component, Pipe, PipeTransform } from '@angular/core';

@Pipe({
    name: 'replace'
})

export class ReplacePipe implements PipeTransform {
    transform(value: any): any {
        value = String(value).toString();
        var afterPoint = '';
        var plus = ',00';
        if (value.length >= 4) {
            if (value.indexOf('.') > 0) {
                afterPoint = value.substring(value.indexOf('.'), value.length);
                var te = afterPoint.substring(0, 3);
                if (te.length == 2) {
                    te = te + '0';
                }
            }
            if (value.indexOf('.') > 0) {
                if (value.indexOf('-') == 0) {
                    value = parseInt(value);
                    if (value == 0) {
                        value = '-' + value + te;
                        value = value.toString();
                    }
                    else {
                        value = value + te;
                        value = value.toString();
                    }
                }
                else {
                    value = parseInt(value);
                    value = value + te;
                    value = value.toString();
                }
            }
            else {
                value = value.toString() + plus;
            }
            var lastTwo = value.substring(value.length - 2);
            var otherNumbers = value.substring(0, value.length - 3);
            if (otherNumbers != '')
                lastTwo = ',' + lastTwo;
            let newValue = otherNumbers.replace(/\B(?=(\d{3})+(?!\d))/g, ".") + lastTwo;
            parseFloat(newValue);
            return `${newValue}`;
        }
}
}

Question 14

ui-number-maskকৌনিক জন্য, https://github.com/assisrafael/angular-input-masks

শুধুমাত্র এই:

<input ui-number-mask ng-model="valores.irrf" />

একের পর এক মান রেখে দিলে ....

need: 120,01

প্রতি অঙ্কে অঙ্ক digit

 = 0,01
 = 0,12
 = 1,20
 = 12,00
 = 120,01 final number.

Question 15

কটাক্ষপাত এই :

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

Question 16

এটা সঠিক উত্তর:

<input type="number" step="0.01" min="-9999999999.99" max="9999999999.99"/>