jQuery .on() انقر فوق حدث يلتقط سمة "data-" الديناميكية في قائمة الأزرار لتمرير القيمة إلى وظيفة أخرى؟

Question

لدي قائمة جدول ديناميكية تضم حوالي 40 صفًا لكل منها زر تعديل يحتوي على حقل تاريخ.لدي أيضًا البرنامج النصي لحدث النقر التالي الذي يحاول إرفاقه بكل زر عبر فئة مشتركة تحتاج إلى الوصول إلى قيمة سمة البيانات داخل رمز صورة الزر الموضح أدناه:

$('.showEdt').each(function () {
   var $this = $(this);
   $(this).on("click",$this.data('eValz'), function () {
          alert(this);
   });
 });

مثال على أزرار التحرير التي يتم إنشاؤها ديناميكيًا:

<img src="edit.png" title="edit" class="showEdt" data-evalz="(eyCKeVua/TNF117)" />

مشكلة:

يتم تحميل البرنامج النصي بشكل جيد، عند النقر فوق زر التحرير، يظهر التنبيه:[كائن HTMLImageElement] بدلاً من قيمة تقييم البيانات ؟؟

يرجى تقديم اقتراحات حول كيفية الوصول إلى البيانات الخاصة بالزر الذي تم النقر عليه؟

Answer 1

أنت لا تستخدم on تعمل بشكل صحيح.إليك إحدى الطرق التي يمكنك من خلالها القيام بذلك: كمان

$('.showEdt').each(function () {
    var $this = $(this);
    $this.on("click", function () {
        alert($(this).data('evalz'));
    });
});

لاحظ أيضًا أنك كتبت eValz بدلاً من evalz على الكود الخاص بك.سمات البيانات حساسة لحالة الأحرف، لذا كن حذرًا بشأن كيفية كتابتها.

Answer 2

$("body").on("click",".showEdt",function(){
    alert($(this).attr("data-evalz"));
});

Fiddle here.

Answer 3

If you're changing the context of 'this' keyword to something else, you can retrieve the data directly from the 'event' object like so:

$('element').on('click', function(event) {
    // 'this' here = externalObject
    this.fnFromExternalObject($(event.currentTarget).data('activate'));
}.bind(externalObject));

I hope the example above is clear...

Answer 4

If your data attribute is known, you can do it directly with an attribute selector in jQuery, like this:

$(document).on('click', "[data-attribute]", function() {
    // Do your tricks here...
});

Answer 5

or just from the event

event.target.attributes.qelemnumber.value