ইভেন্টে jQuery ব্যবহার করে ক্লিক করা উপাদান পান?

Question

গতিশীলভাবে উত্পন্ন বাটনটি ক্লিক করা হয় তা সনাক্ত করতে আমি নিম্নলিখিত কোডটি ব্যবহার করছি।

$(document).on("click",".appDetails", function () {
    alert("test");
});

সাধারণত আপনি যদি ক্লিক করেন এমন উপাদানটি পেতে $('.appDetails').click()ব্যবহার করতে পারেন $(this)। আমি কীভাবে উপরের কোডটি দিয়ে এটি সম্পাদন করব?

এই ক্ষেত্রে:

$(document).on("click",".appDetails", function () {
    var clickedBtnID = ??????
    alert('you clicked on button #' + clickedBtnID);
});

Answer 1

এটি হিসাবে সহজ হতে পারে

$(this)এখানেও ব্যবহার করুন

$(document).on("click",".appDetails", function () {
   var clickedBtnID = $(this).attr('id'); // or var clickedBtnID = this.id
   alert('you clicked on button #' + clickedBtnID);
});

Comments

দেখে মনে হচ্ছে আমি সার্ভার থেকে একটি ক্যাশে সমস্যা নিয়ে কাজ করছি। দুঃখিত

— শয়তানের অ্যাডভোকেট

ES6 ব্যবহারকারীদের জন্য একটি সতর্কতা। তীর ফাংশনগুলি 'এটি' সেট করে না তাই এটি পিতামাতা হবে। সুতরাং, মূলত এখানে একটি তীর ফাংশন ব্যবহার করবেন না।

— থোমাস-পিটার

@ থমাস-পিটার আমি বলছি আপনি

— জ্যাক

@ থমাস-পিটার আমাকে কয়েক ডজন মিনিটের হতাশার হাত থেকে বাঁচিয়েছে, ধন্যবাদ।

— মিলান ভেলিবেট

@ থমাস-পিটার আপনি আমাকে সবেমাত্র বাঁচিয়েছেন! আমি ৩০ মিনিটের মতো কেন জাগ্রত ছিল না তা জানার চেষ্টা করছিলাম ... ধন্যবাদ!

— ক্রিসকোটো বিজি

Answer 2

আপনি আপনার ফাংশনে ইভেন্টের প্যারামিটারটি হারিয়েছেন।

$(document).on("click",".appDetails", function (event) {
    alert(event.target.id);
});

Comments

এটা আমার জন্য নিখুঁত ছিল। এটি ক্লিক করা উপাদানটিকে দেয় - $ (এটি) ইভেন্টটি সংযুক্ত থাকা উপাদানটিকেই দেয়।

— বিল টারবেল

এটি নিখুঁত পদ্ধতি। ধন্যবাদ :)

— স্বতাবজা হাজরা

Answer 3

এটি পরিচালনা করার প্রচলিত পদ্ধতি ES6 এর সাথে ভাল খেলছে না। পরিবর্তে আপনি এটি করতে পারেন:

$('.delete').on('click', event => {
  const clickedElement = $(event.target);

  this.delete(clickedElement.data('id'));
});

মনে রাখবেন যে ইভেন্টের লক্ষ্যটি ক্লিক করা উপাদান হবে, যা আপনার পছন্দ মতো উপাদান নাও থাকতে পারে (এটি ইভেন্টটি প্রাপ্ত শিশু হতে পারে)। আসল উপাদান পেতে:

$('.delete').on('click', event => {
  const clickedElement = $(event.target);
  const targetElement = clickedElement.closest('.delete');

  this.delete(targetElement.data('id'));
});

Answer 4

একটি সহজ উপায় হ'ল আপনার এইচটিএমএল ট্যাগের সাথে ডেটা বৈশিষ্ট্যটি পাস করা।

উদাহরণ:

<div data-id='tagid' class="clickElem"></div>

<script>
$(document).on("click",".appDetails", function () {
   var clickedBtnID = $(this).attr('data');
   alert('you clicked on button #' + clickedBtnID);
});
</script>