jQuery .on ('পরিবর্তন', ফাংশন () am dyn গতিশীলভাবে তৈরি ইনপুটগুলির জন্য ট্রিগার নয়

Question

সমস্যাটি হ'ল আমি কিছু গতিশীল ইনপুট ট্যাগের সেট তৈরি করেছি এবং আমার একটি ফাংশনও রয়েছে যা কোনও ইনপুট মান পরিবর্তিত হওয়ার সাথে সাথে ট্রিগার করার জন্য বোঝানো হয়।

$('input').on('change', function() {
  // Does some stuff and logs the event to the console
});

তবে এটি .on('change')কোনও গতিশীলভাবে তৈরি ইনপুটগুলির জন্য ট্রিগার করছে না, কেবল পৃষ্ঠা লোড করার সময় উপস্থিত আইটেমগুলির জন্য। দুর্ভাগ্যক্রমে এটি আমাকে কিছুটা বাঁধাইয়ের মতো ছেড়ে দেয় কারণ .onপ্রতিস্থাপন .live()এবং .delegate()এর সবগুলিই এর জন্য মোড়কযুক্ত .bind(): /

অন্য কারও কি এই সমস্যা আছে বা এর সমাধান সম্পর্কে জানা আছে?

Answer 1

আপনার এই onফাংশনে একটি নির্বাচক সরবরাহ করা উচিত :

$(document).on('change', 'input', function() {
  // Does some stuff and logs the event to the console
});

সেক্ষেত্রে এটি আপনার প্রত্যাশা অনুযায়ী কাজ করবে। এছাড়াও, নথির পরিবর্তে কিছু উপাদান নির্দিষ্ট করা ভাল।

আরও ভাল বোঝার জন্য এই নিবন্ধটি পড়ুন: http://elijahmanor.com/differences-between-jquery-bind-vs-live-vs-delegate-vs-on/

Comments

তুমি দারুন! আমারও এই সমস্যা ছিল। কখনও ভাবিনি যে আপনি দ্বিতীয় প্যারামিটার হিসাবে নির্বাচককে যুক্ত করতে পারেন।

— টমেট্রক্স

হ্যাঁ, পুরো ডকুমেন্টের পরিবর্তে কোনও উপাদানকে সংকীর্ণ করা ভাল বলে উল্লেখ করা হয়েছে, যদি ডায়নামিক অংশটি তার ডিভের পরে কিছু অংশ ব্যবহার করে, উদাহরণস্বরূপ: $ ('# আজজ্যাক_ টেবিল')। ('পরিবর্তন', 'ইনপুট) ', ফাংশন () {...

— রাউল গোমেজ

যদি আমার উপাদানটি ডায়নামিক্যালি তৈরি করে, আমি কীভাবে পরে এটির সাথে কাজ করব? $ এটি আমাকে খালি বস্তু দেয়।

— আলেেক্সেলা

ইহা যাদুর মত কাজ করে। অনেক ধন্যবাদ ! এছাড়াও, আমরা একই যুক্তিতে দ্বিগুণ যোগ করা রোধ করতে .once () ব্যবহার করতে পারি;)

— বেনফটডাব্লিউ

বিকল্প বাক্য গঠন: $(document).on({ change: handleChange }, 'input');প্লাস ফাংশনটি const handleChange = (event) => { $(event.target)...ঝামেলা এড়ানোর জন্য এটি দুর্দান্ত this।

— ডেম পাইলাফিয়ান

Answer 2

এটা ব্যবহার কর

$('body').on('change', '#id', function() {
  // Action goes here.
});

Comments

অবগতির জন্য, @enrey উল্লেখ ছিল $('#id')পরিবর্তে কোডে'#id'

— ডেলা

Answer 3

আপনি যে কোনও একটি পদ্ধতির প্রয়োগ করতে পারেন:

$("#Input_Id").change(function(){   // 1st
    // do your code here
    // When your element is already rendered
});


$("#Input_Id").on('change', function(){    // 2nd (A)
    // do your code here
    // It will specifically called on change of your element
});

$("body").on('change', '#Input_Id', function(){    // 2nd (B)
    // do your code here
    // It will filter the element "Input_Id" from the "body" and apply "onChange effect" on it
});

Answer 4

$("#id").change(function(){
    //does some stuff;
});

Comments

হুম ... স্নিপেটের ব্যাখ্যা সম্পর্কে কীভাবে?

— ক্লিওপাত্রা

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

— ট্রিগারটির উত্সটি

প্রি-লোডড ডিওএম ব্যবহার না করা পর্যন্ত এই কোডটি কাজ করবে না। আপনাকে ডকুমেন্ট-সম্পর্কিত ভেরিয়েবল হিসাবে নির্বাচকটি পাস করতে হবে api.jquery.com/on/#on-events-selector-data

— benftwc

Answer 5

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

$("#target").change(function(){
    //does some stuff;
});

যখন কোনও উপাদান গতিশীলভাবে লোড হয় পরে আপনি ব্যবহার করতে পারেন:

$(".parent-element").on('change', '#target', function(){
   //does some stuff;
});

Answer 6

$(document).on('change', '#id', aFunc);

function aFunc() {
  // code here...
}

Answer 7

আপনি 'ইনপুট' ইভেন্টটি ব্যবহার করতে পারেন, যখন কোনও উপাদান ব্যবহারকারী ইনপুট পায়।

$(document).on('input', '#input_id', function() {
  // this will fire all possible change actions
});

ডাব্লু 3 থেকে ডকুমেন্টেশন

Answer 8

তুমি ব্যবহার করতে পার:

$('body').ready(function(){
   $(document).on('change', '#elemID', function(){
      // do something
   });
});

এটা আমার সাথে কাজ করে।