เปลี่ยน live () เป็น on () ใน jQuery

แอปพลิเคชันของฉันเพิ่มดรอปดาวน์แบบไดนามิก ผู้ใช้สามารถเพิ่มได้มากเท่าที่ต้องการ

ฉันใช้live()วิธีการแบบดั้งเดิมของ jQuery เพื่อตรวจสอบเมื่อหนึ่งในรายการดรอปดาวน์เหล่านี้ถูกchange()แก้ไข:

$('select[name^="income_type_"]').live('change', function() {
    alert($(this).val());
});

ในฐานะของ jQuery 1.7 ฉันได้อัปเดตสิ่งนี้เป็น:

$('select[name^="income_type_"]').on('change', function() {
    alert($(this).val());
});

ดูเอกสารที่ควรจะสมบูรณ์ (ใช่มั้ย) - แต่ตัวจัดการเหตุการณ์ไม่เริ่มทำงาน แน่นอนฉันยืนยันว่า jQuery 1.7 ถูกโหลดและใช้งานอยู่ ฯลฯ ไม่มีข้อผิดพลาดในบันทึกข้อผิดพลาด

ผมทำอะไรผิดหรือเปล่า? ขอบคุณ!

onเอกสารรัฐ (ตัวหนา;)):

ตัวจัดการเหตุการณ์ถูกผูกไว้กับองค์ประกอบที่เลือกในปัจจุบันเท่านั้น .on()พวกเขาจะต้องอยู่บนหน้าเว็บได้ตลอดเวลารหัสของคุณจะทำให้การเรียกร้องให้

เทียบเท่ากับ.live()จะเป็นอะไรเช่น

$(document.body).on('change', 'select[name^="income_type_"]', function() {
    alert($(this).val());
});

แม้ว่าจะเป็นการดีกว่าถ้าคุณผูกตัวจัดการเหตุการณ์ให้ใกล้ที่สุดเท่าที่จะเป็นไปได้กับองค์ประกอบนั่นคือเพื่อให้องค์ประกอบอยู่ใกล้กับลำดับชั้นมากขึ้น

อัปเดต:ขณะตอบคำถามอื่นฉันพบว่ามีการกล่าวถึงใน.liveเอกสารประกอบ :

.live()วิธีการเขียนใหม่ในแง่ของผู้สืบทอดนั้นเป็นวิธีที่ตรงไปตรงมา นี่คือเทมเพลตสำหรับการโทรที่เทียบเท่าสำหรับวิธีการแนบไฟล์ทั้งสามวิธี

$(selector).live(events, data, handler);                // jQuery 1.3+
$(document).delegate(selector, events, data, handler);  // jQuery 1.4.3+
$(document).on(events, selector, data, handler);        // jQuery 1.7+

นอกจากคำตอบที่เลือกแล้ว

พอร์ตjQuery.liveไปที่ jQuery 1.9+ ในขณะที่รอให้แอปพลิเคชันของคุณโยกย้าย เพิ่มลงในไฟล์ JavaScript ของคุณ

// Borrowed from jQuery 1.8.3's source code
jQuery.fn.extend({
  live: function( types, data, fn ) {
          if( window.console && console.warn ) {
           console.warn( "jQuery.live is deprecated. Use jQuery.on instead." );
          }

          jQuery( this.context ).on( types, this.selector, data, fn );
          return this;
        }
});

หมายเหตุ:ฟังก์ชั่นด้านบนจะไม่ทำงานจาก jQuery v3 ตามที่this.selectorถูกลบออกไป

หรือคุณสามารถใช้https://github.com/jquery/jquery-migrate

เพิ่งพบทางออกที่ดีกว่าซึ่งไม่เกี่ยวข้องกับการแก้ไขรหัสบุคคลที่สาม:

https://github.com/jquery/jquery-migrate/#readme

ติดตั้งแพคเกจ jQuery Migrate NuGet ใน Visual Studio เพื่อให้ปัญหาการกำหนดเวอร์ชันทั้งหมดหายไป ครั้งต่อไปที่ Microsoft อัปเดต AJAX ที่ไม่เป็นการรบกวนและโมดูลการตรวจสอบความถูกต้องอาจลองโดยไม่ต้องย้ายสคริปต์อีกครั้งเพื่อดูว่าพวกเขาแก้ไขปัญหาได้หรือไม่

เนื่องจาก jQuery Migrate ถูกดูแลรักษาโดย jQuery Foundation ฉันคิดว่านี่ไม่ใช่วิธีการที่ดีที่สุดสำหรับห้องสมุดบุคคลที่สามและเพื่อรับข้อความเตือนสำหรับห้องสมุดของคุณโดยละเอียดถึงวิธีการอัปเดต

นอกจากคำตอบที่เลือกแล้ว

ถ้าคุณใช้Visual Studio , คุณสามารถใช้Regex แทนที่
ในแก้ไข> ค้นหาและแทนที่> แทนที่ในไฟล์
หรือ Ctrl + Shift + H

ในค้นหาและแทนที่ป๊อปอัปให้ตั้งค่าฟิลด์เหล่านี้

ค้นหาอะไร: \$\((.*)\)\.live\((.*),
แทนที่ด้วย: $(document.body).on($2,$1,
ในตัวเลือกการค้นหาให้ตรวจสอบ "ใช้นิพจน์ปกติ"

jquery verision xxxjs เปิดเอดิเตอร์ค้นหา jQuery.fn.extend

เพิ่มรหัส

live: function( types, data, fn ) {
        jQuery( this.context ).on( types, this.selector, data, fn );
        return this;
    },

ตัวอย่าง: jquery-2.1.1.js -> บรรทัด 7469 (jQuery.fn.extend)

ดูตัวอย่างภาพ