ফোন: পাঠ্য ইনপুটটির জন্য সংখ্যাযুক্ত কীবোর্ড

Question

কোনও কিবোর্ডটি ফোনে নামিয়ে আনতে বাধ্য করার কোনও উপায় আছে <input type="text">? আমি কেবল বুঝতে পেরেছি যে <input type="number">এইচটিএমএল 5 এ "ভাসমান পয়েন্ট সংখ্যা" এর জন্য, সুতরাং এটি ক্রেডিট কার্ড নম্বর, জিপ কোড ইত্যাদির জন্য উপযুক্ত নয় etc.

<input type="number">ভাসমান-পয়েন্ট সংখ্যা বাদে সংখ্যাসূচক মানগুলি গ্রহণ করে এমন ইনপুটগুলির জন্য আমি সংখ্যাসূচক-কীবোর্ড কার্যকারিতা অনুকরণ করতে চাই । সম্ভবত, অন্য কোনও উপযুক্ত inputটাইপ রয়েছে যা তা করে?

Comments

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

— রায়ান ম্যাকগেরি

: আমি এই ..sort করতে একটি hackish উপায় মূর্ত আউট stackoverflow.com/a/25599024/1922144

— davidcondrey

২০১৫ সালের মাঝামাঝি পর্যন্ত, এটি করার আরও ভাল উপায় রয়েছে: stackoverflow.com/a/31619311/806956

— অ্যারন গ্রে

Answer 1

আপনি করতে পারেন <input type="text" pattern="\d*">। এটি সংখ্যার কীবোর্ড প্রদর্শিত হবে।

আরও বিশদের জন্য এখানে দেখুন: আইওএসের জন্য পাঠ্য, ওয়েব এবং সম্পাদনা প্রোগ্রামিং গাইড

<form>
  <input type="text" pattern="\d*">
  <button type="submit">Submit</button>
</form>

Comments

যদি আপনি কেবল সংখ্যাসূচক কীবোর্ড চান তবে তবে যাচাই করতে না চান (যেমন ক্রোমে), আপনি ফর্মটিতে অফলিবিযুক্ত বৈশিষ্ট্যটি রাখতে পারেন। <ফর্ম ... অলিফলেট>

— ব্রায়ান

আমি খুঁজে পেয়েছি যে \d*কাজ করে না এবং [0-9]প্রয়োজনীয়। মনে রাখবেন যে এটি দিয়ে কাজ করবে type='numeric'। এটি জিপ কোডের জন্য লিঙ্কযুক্ত নথিগুলির রেফারেন্সের ভিত্তিতে প্রস্তাবিত।

— ব্রেট রায়ান

এটি যতক্ষণ আপনার কেবলমাত্র সংখ্যার মান প্রয়োজন ততক্ষণ কাজ করে। ভাসমান পয়েন্ট সংখ্যাগুলির জন্য একটি '' প্রয়োজন। (বা কিছু অঞ্চলের জন্য ',') প্রবেশ করা যাবে না কারণ তাদের কীবোর্ডে এই অক্ষরগুলি অন্তর্ভুক্ত নেই।

— ড্রহল

আমার যদি প্রয়োজন হয়। (বিন্দু), আমি কীভাবে এটি ব্যবহার করতে পারি? এই

<ইনপুট টাইপ = "পাঠ্য" প্যাটার্ন = "\ d *"> অ্যান্ড্রয়েডে কাজ করে না? আমি আইওএসে পরীক্ষা করেছি এবং সফলভাবে কাজ করেছি কিন্তু অ্যান্ড্রয়েডে কাজ করি নি। আমি কীভাবে এটি সমাধান করতে পারি

— কমল

Answer 2

২০১৫ সালের মাঝামাঝি পর্যন্ত, আমি বিশ্বাস করি এটিই সেরা সমাধান:

<input type="number" pattern="[0-9]*" inputmode="numeric">

এটি আপনাকে অ্যান্ড্রয়েড এবং আইওএস উভয়তেই সংখ্যার কীপ্যাড দেবে:

এটি আপনাকে উপরে / ডাউন তীর বোতাম এবং কীবোর্ড বন্ধুত্বপূর্ণ আপ / ডাউন তীর কী বৃদ্ধি সহ প্রত্যাশিত ডেস্কটপ আচরণ দেয়:

এই কোড স্নিপেট এ চেষ্টা করুন:

<form>
  <input type="number" pattern="[0-9]*" inputmode="numeric">
  <button type="submit">Submit</button>
</form>

type="number"এবং উভয়কে একত্রিত করে pattern="[0-9]*আমরা একটি সমাধান পাই যা সর্বত্র কাজ করে। এবং, এর ভবিষ্যতের এইচটিএমএল 5.1 প্রস্তাবিত inputmodeবৈশিষ্ট্যের সাথে সামঞ্জস্যপূর্ণ ।

দ্রষ্টব্য: একটি প্যাটার্ন ব্যবহার করা ব্রাউজারের নেটিভ ফর্ম বৈধকরণকে ট্রিগার করবে। আপনি এটি novalidateবৈশিষ্ট্যটি ব্যবহার করে অক্ষম করতে পারেন, বা বৈশিষ্ট্যটি ব্যবহার করে ব্যর্থ বৈধতার জন্য ত্রুটি বার্তাটি কাস্টমাইজ করতে পারেন title।

---

আপনার যদি শীর্ষস্থানীয় জিরো, কমা বা চিঠি প্রবেশ করতে সক্ষম হতে প্রয়োজন - উদাহরণস্বরূপ, আন্তর্জাতিক ডাক কোড - এই সামান্য বৈকল্পিকটি পরীক্ষা করে দেখুন ।

---

ক্রেডিট এবং আরও পড়া:

http://www.smashingmagazine.com/2015/05/form-inputs-browser-support-issue/ http://danielfriesen.name/blog/2013/09/19/input-type-number-and-ios- সাংখ্যিক কীপ্যাড/

Comments

এইচটিএমএল 5 type="number" স্পেস বলছে নিম্নলিখিত বিষয়বস্তুর বৈশিষ্ট্যগুলি নির্দিষ্ট করা উচিত এবং উপাদানটিতে প্রয়োগ করা উচিত নয়: ... ইনপুটমোড

— Tgr

@ টিজিআর আহ, ভাল ক্যাচ এটি অনুমান করে যে লোকেরা ব্যবহার <input type="text" inputmode="numeric">করতে চায় এবং এটি মোবাইল ব্রাউজারগুলি inputmodeএটির একটি নামপ্যাড বা পূর্ণ কীবোর্ড দেখায় কিনা তা নির্ধারণ করতে চায় । যেহেতু কোনও ব্রাউজার সমর্থন করে না inputmode, আমি নিশ্চিত নই যে এটি কীভাবে ডেস্কটপ বনাম মোবাইল ব্রাউজারগুলিতে প্রয়োগ করা হবে। উদাহরণস্বরূপ: ডেস্কটপ ব্রাউজারগুলি কি চিঠিটি টাইপ করার অনুমতি দেয় <input type="text" inputmode="numeric">? যদি তা হয়, তবে এটি একটি সমস্যা। <input type="number">এটি প্রতিরোধ করে, শুধুমাত্র সংখ্যা অনুমতি দেয় allowing সম্ভবত আমাদের ব্রাউজারগুলি এটি প্রয়োগ করা শুরু না হওয়া পর্যন্ত অপেক্ষা করতে হবে এবং তারপরে আমরা এই উত্তরটি আপডেট করতে পারি।

— অ্যারন গ্রে

সমর্থন type="number"করা হয় শালীন , কিন্তু এটা একটা স্পিনার যা যেমন ক্রেডিট কার্ড নম্বর জন্য অনেক অর্থে দেখা যায় না প্রদর্শন করতে পারে।

— Tgr

টাইপ = "সংখ্যা" থাকাটা গাধা এক্সে ব্যথা হওয়া। (যদি ইনপুটটি অবৈধ হয় তবে আপনি জেএস-এ ইনপুটটির মান পেতে সক্ষম হবেন না, আপনি কার্সার অবস্থান ইত্যাদি পাবেন না

— নিকু সুরডু

This attribute applies when the value of the type attribute is text, search, tel, url, email, or password, otherwise it is ignored.

— মাইকেল লাফারগু

Answer 3

আমি খুঁজে পেয়েছি যে, অন্তত "পাসকোড" -র মতো ক্ষেত্রগুলির জন্য, <input type="tel" />সর্বাধিক খাঁটি নম্বর- ভিত্তিক ক্ষেত্র তৈরির মতো কাজ করে এবং এতে কোনও অটোফর্ম্যাটিংয়ের সুবিধাও নেই । উদাহরণস্বরূপ, সম্প্রতি একটি মোবাইল অ্যাপ্লিকেশনটিতে আমি হিল্টনের জন্য বিকাশ করেছি, আমি এটি দিয়ে শেষ করেছি:

... এবং আমার ক্লায়েন্ট খুব প্রভাবিত হয়েছিল।

<form>
  <input type="tel" />
  <button type="submit">Submit</button>
</form>

Comments

আমার জন্য সমস্যাটি স্ব-বিন্যাসকরণ নয়, বৈধতা ছিল। ধরণের ইনপুট numberবহু ব্রাউজারে সংখ্যার জন্য কঠোর নিয়ম জোর করে। যদি ব্যবহারকারী হাজারে আলাদা করতে স্পেস (বা কমা) যোগ করেন তবে আপনি ইনপুট থেকে কোনও মান পাবেন না। হ্যাঁ, এমনকি জাভাস্ক্রিপ্টেও input.valueখালি থাকবে। প্রকারের ইনপুটটি telনির্দিষ্ট ফর্ম্যাটে সীমাবদ্ধ নয় তাই ব্যবহারকারী এখনও যে কোনও কিছু ইনপুট করতে পারে এবং বৈধতা একটি পৃথক প্রক্রিয়া (বিকাশকারীকে পরিচালনা করতে)।

— নাক্স

আমি কিভাবে কীবোর্ড দশমিক সংখ্যার ব্যবহার করতে পারেন

— Anto

Answer 4

ব্যবহার করে type="email"বা type="url"আপনাকে কমপক্ষে কিছু ফোনে যেমন কীবোর্ড দেয় যেমন আইফোন। ফোন নম্বরগুলির জন্য, আপনি ব্যবহার করতে পারেন type="tel"।

Answer 5

<input type="text" pattern="\d*">সংখ্যার কীবোর্ড আনতে এটি ব্যবহার করে একটি বিপদ রয়েছে । ফায়ারফক্স এবং ক্রোমে, প্যাটার্নের মধ্যে থাকা নিয়মিত এক্সপ্রেশন ব্রাউজারকে সেই অভিব্যক্তিটির ইনপুটটি বৈধতা দেয়। ত্রুটিগুলি ঘটবে যদি এটি প্যাটার্নটির সাথে মেলে না বা ফাঁকা ছেড়ে যায়। অন্যান্য ব্রাউজারে অনিচ্ছাকৃত ক্রিয়া সম্পর্কে সচেতন হন।

Comments

এতে থাকাতে একটি novalidateবৈশিষ্ট্য যুক্ত করা form elementস্বতঃ-বৈধতা সমস্যাগুলির সাথে ডিল করা উচিত। নিজে থেকে কিছু বৈধতা নিশ্চিত করুন।

— জাস্টাস রোমিজন

Answer 6

<input type="text" inputmode="numeric">

সঙ্গে Inputmode আপনি ব্রাউজারে একটি ইঙ্গিতটি দিতে পারেন।

Answer 7

আমার কাছে মনে type="number"হয় সিমেন্টিক ওয়েব পৃষ্ঠার জন্য সেরা। আপনি যদি কেবল কীবোর্ড পরিবর্তন করতে চান তবে আপনি ব্যবহার করতে পারেন type="number"বা type="tel"। উভয় ক্ষেত্রেই, আইফোন ব্যবহারকারীর ইনপুটকে সীমাবদ্ধ করে না। ব্যবহারকারী এখনও যে কোনও অক্ষর টাইপ করতে পারেন (বা পেস্ট করতে পারেন)। একমাত্র পরিবর্তনটি ব্যবহারকারীকে দেখানো কীবোর্ড। আপনি যদি এর বাইরে কোনও বিধিনিষেধ চান তবে আপনার জাভাস্ক্রিপ্ট ব্যবহার করা উচিত।

Comments

আমার কাছে সমস্যাটি হ'ল টাইপ = "নাম্বার" কেবল ভাসমান পয়েন্ট সংখ্যাগুলির জন্যই মনে করা হয় - সুতরাং কোনও ক্রেডিট কার্ড, জিপ কোড, বা অন্যান্য সংখ্যার কেবল কয়েকটি স্ট্রিং নেই। আমি আশা করছিলাম যে এটির এনকোডিংয়ের পাশাপাশি সঠিক কীবোর্ড প্রদর্শন করার জন্য দুটি অর্থই রয়েছে। আমার মনে হয় উপযুক্ত প্রকারটি ইনপুট টাইপ = "পাঠ্য" হবে তবে ভুল কীবোর্ড প্রদর্শিত হবে। আপনি যদি এটি করতে কিছু জাভাস্ক্রিপ্টের দিকে আমাকে নির্দেশ করতে পারেন তবে তা উভয় সমস্যারই সমাধান করবে।

— তামি

type="number"ভাসা জন্য। type="text"স্ট্রিং জন্য হয়। আপনি যা চান তা পূর্ণসংখ্যার। আমি মনে করি ভাসা স্ট্রিংয়ের চেয়ে পূর্ণসংখ্যার নিকটে। আপনি কি মনে করেন?

— বিড়াল চেন

টাইপ = "সংখ্যা" এর সাথে সাবধান থাকার একটি বিষয় হ'ল ক্রোম অন্তত ইনপুটটিকে একটি সংখ্যা হিসাবে বাধ্য করবে - যা স্পেস দিয়ে প্রবেশ করা ক্রেডিট কার্ড নম্বরগুলিকে ভেঙে ফেলবে (উদাহরণস্বরূপ)

— জন কার্টার

@ এখানে থেকে এটি জিপ কোডগুলিও পছন্দ 01920করবে 1920।

— সেজেজোজ

এটা করবে না এছাড়াও জগাখিচুড়ি আপ ব্যবহারকারী তাদের ব্রাউজারে একটি ভিন্ন ভাষা সেট হয়েছে থাকে stackoverflow.com/questions/5345095/...

— dalore

Answer 8

আমার জন্য সবচেয়ে ভাল সমাধানটি ছিল:

পূর্ণসংখ্যার সংখ্যার জন্য, যা অ্যান্ড্রয়েড এবং আইফোনে 0-9 প্যাড নিয়ে আসে

<label for="ting">
<input id="ting" name="ting" type="number" pattern="[\d]*" />

ফায়ারফক্স / ক্রোম / সাফারিতে স্পিনারদের আড়াল করতে আপনি এটি করতেও চাইতে পারেন, বেশিরভাগ ক্লায়েন্টরা মনে করেন যে তারা কুৎসিত দেখাচ্ছে

 input[type=number]::-webkit-inner-spin-button,
 input[type=number]::-webkit-outer-spin-button {
      -webkit-appearance: none;
      margin: 0;
 }

 input[type=number] {
      -moz-appearance:textfield;
 }

এবং আপনার কাস্টম বৈধতা যদি আপনার ফর্ম উপাদানটিতে no)ate = 'no)ate' যুক্ত করুন

পিএস ঠিক যদি আপনি আসলে সব পরে ভাসমান পয়েন্ট সংখ্যা চেয়েছিলেন, আপনি চান যথাযথতা যাও পদক্ষেপ, যোগ করা হবে। ' অ্যান্ড্রয়েড থেকে

<label for="ting">
<input id="ting" name="ting" type="number" pattern="[\d\.]*" step="0.01" />

Answer 9

2018 সালে:

<input type="number" pattern="\d*">

Android এবং iOS উভয়ের জন্য কাজ করছে।

আমি অ্যান্ড্রয়েড (^ 4.2) এবং আইওএস (11.3) এ পরীক্ষা করেছি

Answer 10

আপনি এটির মতো চেষ্টা করতে পারেন:

<input type="number" name="input">
<input type="submit" value="Next" formnovalidate="formnovalidate">

তবে সাবধান হন: যদি আপনার ইনপুটটিতে একটি সংখ্যা ছাড়া অন্য কিছু থাকে তবে এটি সার্ভারে সঞ্চারিত হবে না।

Answer 11

আমি এমন একটি পরিস্থিতি খুঁজে পাইনি যা সব পরিস্থিতিতে আমার পক্ষে সবচেয়ে ভাল কাজ করেছিল: আমাকে সংখ্যার প্রবেশদ্বারে ডিফল্ট করতে হবে (উদাহরণস্বরূপ "7.5" এন্ট্রি) তবে নির্দিষ্ট সময়ে পাঠ্যের (উদাহরণস্বরূপ "পাস") এর অনুমতিও দেওয়া হয়েছিল। ব্যবহারকারীরা একটি সংখ্যার কীপ্যাড চেয়েছিলেন (উদাহরণস্বরূপ 7.5 এর প্রবেশ) তবে মাঝে মাঝে পাঠ্য প্রবেশের প্রয়োজন ছিল (উদাহরণস্বরূপ "পাস")।

বরং আমি যা করেছি তা হ'ল ফর্মটিতে একটি চেকবক্স যুক্ত করা এবং ব্যবহারকারীকে আমার ইনপুট (আইডি = "ইনপুটস্রসাল্ট") টাইপ = "সংখ্যা" এবং টাইপ করুন = "পাঠ্য" এর মধ্যে g

<input type="number" id="result"... >
<label><input id="cbAllowTextResults" type="checkbox" ...>Allow entry of text results.</label>

তারপরে আমি চেকবক্সে একটি ক্লিক হ্যান্ডলারটি তারযুক্ত করেছি যা উপরের চেকবক্সটি চেক করা আছে কিনা তার উপর ভিত্তি করে পাঠ্য এবং সংখ্যার মধ্যে প্রকার টোগল করে:

$(document).ready(function () {
    var cb = document.getElementById('cbAllowTextResults');
    cb.onclick = function (event) {
        if ($("#cbAllowTextResults").is(":checked"))
            $("#result").attr("type", "text");
        else
            $("#result").attr("type", "number");

    }
});

এটি আমাদের পক্ষে ভাল কাজ করেছে।

Answer 12

 <input type="text" inputmode="decimal">

এটি সংখ্যার কী-প্যাড ব্যবহার করে আপনাকে পাঠ্য ইনপুট দেবে

Answer 13

আপনি inputmodeএইচটিএমএল বৈশিষ্ট্যটি ব্যবহার করতে পারেন :

<input type="text" inputmode="numeric" />

আরও বিশদের জন্য ইনপুটমোডে MDN নথিটি পরীক্ষা করে দেখুন ।

Comments

এই উত্তরটি @ রাল্ফ ডি ক্লিন

— এক্সকোবাল্ট

Answer 14

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

$(document).ready(function() {
    $(document).find('input[type=number]').attr('type', 'tel');
});

উল্লেখ করুন: https://answers.laserfiche.com/questions/88002/Use-number-field-input-type-with-Field-Mask