এইচটিএমএল <ইনপুট টাইপ = "পাঠ্য" /> ওনিচ ইভেন্টটি কাজ করছে না

Question

আমি কিছু পরীক্ষা করার চেষ্টা করছি। আমি যেটি ঘটতে চাই তা হ'ল প্রতিবার পাঠ্য বাক্সের কোনও কিছুতে ব্যবহারকারী টাইপ করলে এটি একটি ডায়ালগ বক্সে প্রদর্শিত হবে। onchangeঘটনাটির সম্পত্তিটি এটি ঘটানোর জন্য আমি ব্যবহার করেছি তবে এটি কার্যকর হয় না। এটি কাজ করতে আমাকে এখনও সাবমিট বাটন টিপতে হবে। আমি এজেএক্স সম্পর্কে পড়েছি এবং আমি এটি সম্পর্কে শিখতে চাই। এটিকে কাজ করার জন্য এখনও আমার কি এজেএক্স দরকার বা সহজ জাভাস্ক্রিপ্ট যথেষ্ট? সাহায্য করুন.

index.php

<script type="text/javascript" src="javascript.js"> </script>

<form action="index.php" method="get">
 Integer 1: <input type="text" id="num1" name="num1" onchange="checkInput('num1');" /> <br />
 Integer 2: <input type="text" id="num2" name="num2" onchange="checkInput('num2');" /> <br />
 <input type="submit" value="Compute" />
</form>

javascript.js

function checkInput(textbox) {
 var textInput = document.getElementById(textbox).value;

 alert(textInput); 
}

Comments

আপনি

— আইডিটির

হ্যাঁ ... ধন্যবাদ আমি অ্যাশ বুর্লাকজেনকো আমাকে যা বলেছিলাম তা করেছি ...

— কোডার

জ্যাকুয়ারির সাথে, এখানে দুর্দান্ত সমাধান প্রস্তাবিত: স্ট্যাকওভারফ্লো.

— com/a/8167009

stackoverflow.com/a/54079997/5626568

— ℛɑƒæĿᴿᴹᴿ

Answer 1

onchangeনিয়ন্ত্রণটি অস্পষ্ট হলেই ট্রিগার করা হয়। onkeypressপরিবর্তে চেষ্টা করুন।

Comments

ক্লিপবোর্ড থেকে ব্যবহারকারী পেস্ট করার পরে পরিবর্তন সনাক্ত করার জন্য কাজ করে না

— জুওজাস কনটভেইনিস

এটা আমার সমস্যা ঠিক করেছে। onkeyupযদিও আমি পছন্দ করি, এটি input('

— এলিমেন্ট.ভ্যালু

আমি আরও লক্ষ্য করেছি যে "কীপ্রেস" ব্যাকস্পেস টিপানোর পরে উত্থাপিত হয় না, কমপক্ষে jquery ব্যবহার করার সময়। ব্যাকস্পেস টিপে এবং ছেড়ে দেওয়ার পরে "কীআপ" উত্থিত হয়। "ইনপুট" এই সমস্যাটি সমাধান করে এবং অনুলিপি-পেস্টের জন্যও কাজ করে এবং আমি মনে করি এটি এখানে সঠিক সমাধান (ব্যবহারকারী হিসাবে "99 সমস্যা - সিনট্যাক্স এক নয়" নীচে তুলে ধরে)।

— প্যাট্রিক ফিনিগান

'onkeypres', 'onkeyup', ইত্যাদি কোনও সমাধান হয় না যখন যখন পাঠ্য পরিবর্তিত হয় কেবল কোনও ফাংশন কল করতে চায় ! মূল ইভেন্টগুলি এক্ষেত্রে একটি অপ্রয়োজনীয় ট্র্যাফিক উত্পাদন করে। (খুব আশ্চর্যের বিষয় যে এই উত্তরটি সমাধান হিসাবে বেছে নেওয়া হয়েছে, উদাহরণস্বরূপ এতোটুকু ভোট দিয়ে! !! আমি এটিকে হ্রাস করি না, কারণ আমি কেবল উত্তরগুলি কম করে দিতে পছন্দ করি না I কারণ) (গুলি) কেন দিতে চাই তা কেন? ঠিক আছে না - এটি আরও সহায়ক!)

— অ্যাপোস্টোলোস

এইচটিএমএল ≥5 বা jQuery ≥1.7 এর জন্য নীচে অন্যান্য সমাধান রয়েছে, যা ক্লিপবোর্ড থেকে আটকানো পরিচালনা করে।

— ব্যবহারকারী 202729

Answer 2

.on('input'...JQuery 1.7 এবং উপরের থেকে প্রতিটি ইনপুট (পেস্ট, কীআপ, ইত্যাদি) -র প্রতিটি পরিবর্তন নিরীক্ষণের জন্য ব্যবহার করুন ।

স্থিতিশীল এবং গতিশীল ইনপুটগুলির জন্য:

$(document).on('input', '.my-class', function(){
    alert('Input changed');
});

কেবল স্থিতিশীল ইনপুটগুলির জন্য:

$('.my-class').on('input', function(){
    alert('Input changed');
});

স্থির / গতিশীল উদাহরণ সহ জেএসফিডাল: https://jsfiddle.net/op0zqrgy/7/

Comments

এটি আমার জন্য নিখুঁতভাবে কাজ করেছে - ধন্যবাদ। অন্যদের জন্য দ্রষ্টব্য - আপনার অন্লোডে উপরোক্ত কোডটি বা এটি 'শুরু' পর্যবেক্ষণের জন্য আসলে বাস্তবায়ন করতে ভুলবেন না।

— রবার্ট পেনরিজ 3'14

একটি মন্তব্যে খুব দেরী হয়েছে ... তবে উত্তর ব্যবহারকারী যদি সরল জাভাস্ক্রিপ্ট দেখায় তবে আপনি jQuery ব্যবহারের পরামর্শ দিচ্ছেন কেন?

— অ্যান্ড্রেস

@ অ্যান্ড্রেস মোরেলস এটি একটি সাধারণ গ্রন্থাগার যা অনেক অ্যাপ্লিকেশনগুলিতে তাত্ক্ষণিকভাবে অ্যাক্সেস পায় এবং এগুলি যুক্ত করা সহজ। স্পষ্টতই, এই উত্তরগুলি সেই অ্যাপ্লিকেশনগুলিতে প্রযোজ্য না যা jQuery ব্যবহার করতে পারে না (বা না পছন্দ করে)।

— rybo111

@ rybo111 ঠিক! jQuery একটি সাধারণ গ্রন্থাগার এবং বহুল ব্যবহৃত, তবে এটি "জাভাস্ক্রিপ্ট ব্যবহার করে দুটি সংখ্যার যোগফল" এবং এটি করার জন্য jQuery ব্যবহার সম্পর্কে সর্বাধিক উত্সাহিত উত্তর সম্পর্কে মেমের প্রশ্নের সাথে সরাসরি যুক্ত করে। এটি কেস নয় তবে অনেকে জাভাস্ক্রিপ্ট এবং jQuery আলাদা করতে পারবেন না।

— আন্দ্রেস মোরেলস

@ অ্যান্ড্রেস মোরেলস আমার উত্তরটি "পেস্ট, কীআপ ইত্যাদি" কভার করে নোট করুন। আমি এই প্রশ্নের উত্তর দেওয়ার সময় jQuery সমাধানটি সুবিধাজনক বলে মনে করছি (7 বছর আগে!)!

— rybo111

Answer 3

কীস্ট্রোকের জন্য অনুসন্ধান করা কেবলমাত্র একটি আংশিক সমাধান, কারণ মাউস ক্লিকগুলি ব্যবহার করে কোনও ইনপুট ক্ষেত্রের বিষয়বস্তু পরিবর্তন করা সম্ভব। আপনি যদি কোনও পাঠ্য ক্ষেত্রে ডান ক্লিক করেন তবে আপনি কীস্ট্রোক না করে মান পরিবর্তন করতে ব্যবহার করতে পারেন এমন বিকল্পগুলি কেটে পেস্ট করতে পারেন। তেমনি, যদি স্বতঃপূরণ সক্ষম হয় তবে আপনি একটি ক্ষেত্রের বাম-ক্লিক করতে পারেন এবং পূর্বে প্রবেশ করা পাঠ্যের একটি ড্রপডাউন পেতে পারেন, এবং মাউস ক্লিক ব্যবহার করে আপনার পছন্দগুলির মধ্যে থেকে নির্বাচন করতে পারেন। কীস্ট্রোক ফাঁদে ফেলা এই ধরণের পরিবর্তনগুলির কোনওরই সনাক্ত করতে পারে না।

দুঃখের বিষয়, এমন কোনও "উদ্বোধনী" ইভেন্ট নেই যা অবিলম্বে পরিবর্তনের খবর দেয়, কমপক্ষে আমি জানি। তবে একটি সমাধান রয়েছে যা সমস্ত ক্ষেত্রে কার্যকর হয়: সেটইন্টারভাল () ব্যবহার করে একটি সময় অনুষ্ঠান সেট আপ করুন।

ধরা যাক যে আপনার ইনপুট ক্ষেত্রে "সিটি" এর একটি আইডি এবং নাম রয়েছে:

<input type="text" name="city" id="city" />

"শহর" নামে একটি বৈশ্বিক পরিবর্তনশীল রয়েছে:

var city = "";

এটি আপনার পৃষ্ঠার সূচনাতে যুক্ত করুন:

setInterval(lookForCityChange, 100);

তারপরে একটি লুক ফরসিটি চেঞ্জ () ফাংশন সংজ্ঞায়িত করুন:

function lookForCityChange()
{
    var newCity = document.getElementById("city").value;
    if (newCity != city) {
        city = newCity;
        doSomething(city);     // do whatever you need to do
    }
}

এই উদাহরণে, "শহর" এর মান প্রতি 100 মিলিসেকেন্ডে পরীক্ষা করা হয়, যা আপনি আপনার প্রয়োজন অনুসারে সামঞ্জস্য করতে পারেন। আপনি যদি চান তবে লুকঅফটিসিটি চেঞ্জ () সংজ্ঞায়নের পরিবর্তে একটি বেনামি ফাংশন ব্যবহার করুন। আপনার কোড বা এমনকি ব্রাউজার ইনপুট ক্ষেত্রের জন্য প্রাথমিক মান সরবরাহ করতে পারে তাই সচেতন থাকুন যাতে ব্যবহারকারীকে কিছু করার আগে আপনাকে "পরিবর্তন" সম্পর্কে অবহিত করা যেতে পারে; আপনার কোডটি প্রয়োজনীয় হিসাবে সামঞ্জস্য করুন।

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

Comments

যদি কোনও ইনপুট ক্ষেত্রের মান ফোকাস না করে পরিবর্তন করা সম্ভব না হয় এবং যখন কোনও উপাদান ফোকাস হারিয়ে ফেলেন তখন একটি ঝাপসা দেখা দেয়, তবে কেন কেবলমাত্র onblur পরিবর্তনগুলি অনুসন্ধান করবেন না?

— পাকম্যান

ইনপুট ক্ষেত্রটি পরিবর্তিত হয়ে গেলে বা পরিবর্তনের পরে ফোকাস হারিয়ে ফেললে আপনি কি পদক্ষেপ নিতে চান? আপনি যদি তাত্ক্ষণিকভাবে কাজ করতে চান তবে আপনি onblur এর জন্য অপেক্ষা করতে পারবেন না।

— ড্রাগনফ্লাই

@ পাইকম্যান এটি কিছু ক্ষেত্রে একটি শালীন সমাধান। তবে আপনি যদি টাইপের মতো সন্ধান করতে চান - খুব সুন্দর একটি বৈশিষ্ট্য আইএমও (কম্পিউটার যখন এত তাড়াতাড়ি এবং বিরক্ত না হয়ে কম্পিউটার ব্যবহার করতে পারে তখন ব্যবহারকারীকে কেন জিনিস সন্ধান করতে হবে?) - বা অন্য কিছু সত্যিই যে পাঠ্য পরিবর্তিত হলে ঘটতে হবে, আপনি কেন সক্ষম হবেন না?

— দাগ

এটি দুঃখজনক যে এটি আসে।

— চাক ব্যাটসন

@ চকব্যাটসন এই উত্তরটি ২০১২ সাল থেকে I

— rybo111

Answer 4

এইচটিএমএল 5oninput সরাসরি সমস্ত পরিবর্তনগুলি ধরার জন্য একটি ইভেন্টকে সংজ্ঞায়িত করে । এটা আমার জন্য কাজ করে.

Comments

টাইপ = "সংখ্যা" স্পিনার নিয়ন্ত্রণের সাথেও কাজ করে (যেটি অন্ক্রিপ্স কাজ করে না)।

— বব

Answer 5

onchange কেবলমাত্র তখনই ঘটে যখন ইনপুট উপাদানের পরিবর্তনটি ব্যবহারকারী দ্বারা প্রতিশ্রুতিবদ্ধ হয়, যখন বেশিরভাগ সময় উপাদান ফোকাস হারিয়ে ফেলে।

যদি আপনি চান আপনার ক্রিয়াকলাপটি অজানাতে চাইলে oninputইভেন্টটি ব্যবহার করা উচিত উপাদানটির মান পরিবর্তিত হয় - এটি কী-আপ / ডাউন ইভেন্টগুলির চেয়ে ভাল কারণ ব্যবহারকারীর মাউস অর্থাত্ পেস্ট করা, বা স্বতঃপূর্ণ ইত্যাদি দ্বারা মান পরিবর্তন করা যায় etc

পরিবর্তন ইভেন্ট সম্পর্কে আরও পড়ুন এখানে

এখানে ইনপুট ইভেন্ট সম্পর্কে আরও পড়ুন

Answer 6

"চালু" এর পরিবর্তে নিম্নলিখিত ইভেন্টগুলি ব্যবহার করুন

- onkeyup(event)
- onkeydown(event)
- onkeypress(event)

Answer 7

প্রথমত, 'কাজ করে না' কী? সতর্কতা দেখছেন না?

এছাড়াও, আপনার কোডটি এটিকে সরল করা যেতে পারে

<input type="text" id="num1" name="num1" onkeydown="checkInput(this);" /> <br />

function checkInput(obj) {
    alert(obj.value); 
}

Answer 8

আমি এমন সমস্যার মুখোমুখি হয়েছি যেখানে সাফারি একটি পাঠ্য ইনপুট ক্ষেত্রে "চালু" ইভেন্টগুলিতে গুলি চালাচ্ছে না। আমি একটি jQuery 1.7.2 "পরিবর্তন" ইভেন্ট ব্যবহার করেছি এবং এটিও কার্যকর হয়নি। আমি ZURB এর টেক্সটচেঞ্জ ইভেন্টটি ব্যবহার করে শেষ করেছি। এটি মাউস ইনভেস্টগুলির সাথে কাজ করে এবং ক্ষেত্রটি ছাড়াই আগুন জ্বালাতে পারে:
http://www.zurb.com/playground/jquery-text-change-custom-event

$('.inputClassToBind').bind('textchange', function (event, previousText) {
    alert($(this).attr('id'));
});

Answer 9

আইএমও গুরুত্বপূর্ণ যে কয়েকটি মন্তব্য:

• ব্যবহারকারী পদক্ষেপ প্রবেশ বা অস্পষ্ট হওয়া অবধি সঠিক আচরণের অপেক্ষা না করা অবধি ইনপুট উপাদানগুলি 'পরিবর্তন' ইভেন্টটি ছাড়ছে না ।

• আপনি যে ইভেন্টটি ব্যবহার করতে চান তা হ'ল "input"(" অনিনপুট ")। এখানে উভয়ের মধ্যে পৃথকীকরণটি ভালভাবে প্রদর্শিত হয়েছে: https://javascript.info/events- परिवर्तन-input

• দুটি ইভেন্ট দুটি পৃথক ব্যবহারকারীর অঙ্গভঙ্গি / মুহুর্তগুলিকে সংকেত দেয় ("ইনপুট" ইভেন্টের অর্থ ব্যবহারকারী একটি নির্বাচিত তালিকার বিকল্পগুলি লিখছেন বা নেভিগেট করছেন, কিন্তু তারপরেও পরিবর্তনটি নিশ্চিত করেননি "" পরিবর্তন "মানে ব্যবহারকারী মান পরিবর্তন করেছে (একটি প্রবেশ বা অস্পষ্টতা সহ) আমাদের)

• এখানে প্রস্তাবিত অনেকের মতো মূল ইভেন্টগুলির জন্য শোনা এই ক্ষেত্রে একটি খারাপ অভ্যাস। (লোকেরা যেমন ইনপুটগুলিতে ENTER এর ডিফল্ট আচরণটি পরিবর্তন করে) ...

• jQuery এর সাথে কিছু করার নেই। এটি সব এইচটিএমএল স্ট্যান্ডার্ডে।

• আপনার যদি সঠিক আচরণটি বুঝতে সমস্যা হয় তবে এটি সম্ভবত পরীক্ষামূলক হিসাবে সহায়ক, আপনার পাঠ্য সম্পাদক বা ব্রাউজারটি মাউস / প্যাড ছাড়াই ব্যবহার করুন, কেবল একটি কীবোর্ড।

আমার দুই সেন্ট.

Answer 10

অনকিআপ আমার পক্ষে কাজ করেছিল। পিছনে স্থান টিপে onkeypress ট্রিগার করে না।

Comments

একটি মূল্য পেস্ট করা হয় যখন? ইভেন্টটিও ট্রিগার করতে আমি "অনপেষ্ট" ব্যবহার করি

— লুই

Answer 11

এটা ব্যবহার করা উত্তম onchange(event)সঙ্গে <select>। আপনার সাথে <input>নীচের ইভেন্টটি ব্যবহার করতে পারেন:

- onkeyup(event)
- onkeydown(event)
- onkeypress(event)

Answer 12

চেষ্টা onpropertychange। এটি কেবল আইইয়ের জন্য কাজ করে।

Comments

কেন কেউ এমন কোনও সম্পত্তি বিবেচনা করতে চান যা কেবলমাত্র একটি ওবিসোলেট ব্রাউজারে কাজ করে যা তার বিকাশকারী দ্বারা পরিত্যাজ্য করা হয়েছে? ডাউনভোট

— সোড সর্বশক্তিমান