ฟังก์ชัน event.preventDefault () ไม่ทำงานใน IE

ต่อไปนี้เป็นรหัส JavaScript (mootools) ของฉัน:

$('orderNowForm').addEvent('submit', function (event) {
    event.preventDefault();
    allFilled = false;
    $$(".required").each(function (inp) {
        if (inp.getValue() != '') {
            allFilled = true;
        }
    });

    if (!allFilled) {
        $$(".errormsg").setStyle('display', '');
        return;
    } else {
        $$('.defaultText').each(function (input) {
            if (input.getValue() == input.getAttribute('title')) {
                input.setAttribute('value', '');
            }
        });
    }

    this.send({
        onSuccess: function () {
            $('page_1_table').setStyle('display', 'none');
            $('page_2_table').setStyle('display', 'none');
            $('page_3_table').setStyle('display', '');
        }
    });
});

ในเบราว์เซอร์ทั้งหมดยกเว้น IE สิ่งนี้ใช้ได้ดี แต่ใน IE สิ่งนี้ทำให้เกิดข้อผิดพลาด ฉันมี IE8 ดังนั้นในขณะที่ใช้ดีบักเกอร์ JavaScript ฉันพบว่าeventวัตถุไม่มีpreventDefaultวิธีการที่ทำให้เกิดข้อผิดพลาดและดังนั้นจึงมีการส่งแบบฟอร์ม วิธีการรองรับในกรณีของ Firefox (ซึ่งฉันพบโดยใช้ Firebug)

ความช่วยเหลือใด ๆ

ใน IE คุณสามารถใช้

event.returnValue = false;

เพื่อให้ได้ผลลัพธ์เดียวกัน

และเพื่อไม่ให้เกิดข้อผิดพลาดคุณสามารถทดสอบการมีอยู่ของ PreventDefault:

if(event.preventDefault) event.preventDefault();

คุณสามารถรวมสองรายการเข้าด้วยกัน:

event.preventDefault ? event.preventDefault() : (event.returnValue = false);

หากคุณผูกเหตุการณ์ผ่านฟังก์ชั่น addEvent ของ mootools ตัวจัดการเหตุการณ์ของคุณจะได้รับเหตุการณ์ที่ผ่านการแก้ไข (เพิ่ม) เป็นพารามิเตอร์ มันจะมีเมธอด PreventDefault () เสมอ

ลองเล่นซอนี้เพื่อดูความแตกต่างของการผูกเหตุการณ์ http://jsfiddle.net/pFqrY/8/

// preventDefault always works
$("mootoolsbutton").addEvent('click', function(event) {
 alert(typeof(event.preventDefault));
});

// preventDefault missing in IE
<button
  id="htmlbutton"
  onclick="alert(typeof(event.preventDefault));">
  button</button>

สำหรับผู้ใช้jQueryทุกคนคุณสามารถแก้ไขเหตุการณ์เมื่อจำเป็น สมมติว่าคุณใช้ HTML onclick = ".. " และรับเหตุการณ์เฉพาะของ IE ที่ไม่มี preventDefault () เพียงแค่ใช้รหัสนี้เพื่อรับมัน

e = $.event.fix(e);

หลังจากนั้น e.preventDefault (); ทำงานได้ดี

ฉันรู้ว่ามันค่อนข้างโพสต์เก่า แต่ฉันใช้เวลาพยายามทำให้งานนี้ใน IE8

ดูเหมือนว่ามีความแตกต่างบางประการในเวอร์ชัน IE8 เนื่องจากโซลูชันที่โพสต์ที่นี่และในเธรดอื่นไม่ได้ผลสำหรับฉัน

สมมติว่าเรามีรหัสนี้:

$('a').on('click', function(event) {
    event.preventDefault ? event.preventDefault() : event.returnValue = false;
});

ในpreventDefault()วิธีIE8 ของฉันมีอยู่เพราะ jQuery แต่ไม่ทำงาน (อาจเป็นเพราะจุดด้านล่าง) ดังนั้นสิ่งนี้จะล้มเหลว

แม้ว่าฉันจะตั้งค่าreturnValueคุณสมบัติโดยตรงเป็นเท็จ:

$('a').on('click', function(event) {
    event.returnValue = false;
    event.preventDefault();
});

สิ่งนี้ยังใช้งานไม่ได้เพราะฉันเพิ่งตั้งค่าคุณสมบัติบางอย่างของวัตถุเหตุการณ์ที่กำหนดเองของ jQuery

ทางออกเดียวที่เหมาะกับฉันคือการตั้งค่าคุณสมบัติreturnValueของตัวแปรทั่วโลก eventเช่นนี้:

$('a').on('click', function(event) {
    if (window.event) {
        window.event.returnValue = false;
    }
    event.preventDefault();
});

เพียงเพื่อให้ง่ายขึ้นสำหรับคนที่จะพยายามโน้มน้าวให้ IE8 ทำงาน ฉันหวังว่า IE8 จะตายอย่างน่ากลัวในความตายอันเจ็บปวดในไม่ช้า

UPDATE:

เมื่อsv_inชี้ให้เห็นคุณสามารถใช้event.originalEventเพื่อรับวัตถุเหตุการณ์ดั้งเดิมและตั้งค่าreturnValueคุณสมบัติในวัตถุดั้งเดิม แต่ฉันยังไม่ได้ทดสอบใน IE8 ของฉันเลย

Mootools นิยามใหม่ preventDefault ในวัตถุเหตุการณ์ ดังนั้นรหัสของคุณควรทำงานได้ดีในทุกเบราว์เซอร์ ถ้าไม่เช่นนั้นแสดงว่ามีปัญหากับการรองรับ ie8 ใน mootools

คุณทดสอบโค้ดของคุณบน ie6 และ / หรือ ie7 หรือไม่?

หมอพูด

ทุกเหตุการณ์ที่เพิ่มเข้ามาด้วย addEvent จะได้รับวิธีการ mootools โดยอัตโนมัติโดยไม่จำเป็นต้องทำการอินสแตนซ์ด้วยตนเอง

แต่ในกรณีที่ไม่เป็นเช่นนั้นคุณอาจต้องการลอง

new Event(event).preventDefault();

if (e.preventDefault) {
    e.preventDefault();
} else {
    e.returnValue = false;
}

ทดสอบบน IE 9 และ Chrome

หากต้องการปิดใช้งานแป้นคีย์บอร์ดหลังจาก IE9 ให้ใช้: e.preventDefault();

หากต้องการปิดใช้งานแป้นคีย์บอร์ดปกติภายใต้ IE7 / 8 ให้ใช้: e.returnValue = false;หรือreturn false;

หากคุณพยายามปิดการใช้งานแป้นพิมพ์ลัด (ด้วย Ctrl เช่นCtrl+F) คุณต้องเพิ่มบรรทัดเหล่านั้น:

try {
    e.keyCode = 0;
}catch (e) {}

นี่คือตัวอย่างเต็มรูปแบบสำหรับ IE7 / 8 เท่านั้น:

document.attachEvent("onkeydown", function () {
    var e = window.event;

    //Ctrl+F or F3
    if (e.keyCode === 114 || (e.ctrlKey && e.keyCode === 70)) {
        //Prevent for Ctrl+...
        try {
            e.keyCode = 0;
        }catch (e) {}

        //prevent default (could also use e.returnValue = false;)
        return false;
    }
});

การอ้างอิง: วิธีปิดใช้งานแป้นพิมพ์ลัดใน IE7 / IE8

นี่คือฟังก์ชั่นที่ฉันได้ทำการทดสอบด้วย jquery 1.3.2 และ 09-18-2009 build ทุกคืน แจ้งให้เราทราบผลลัพธ์ของคุณด้วย ทุกอย่างดำเนินไปด้วยดีในส่วนนี้ใน Safari, FF, Opera บน OSX มันใช้สำหรับการแก้ไขข้อผิดพลาด IE8 ที่เป็นปัญหาเท่านั้นและอาจมีผลลัพธ์ที่ไม่ได้ตั้งใจ:

function ie8SafePreventEvent(e) {
    if (e.preventDefault) {
        e.preventDefault()
    } else {
        e.stop()
    };

    e.returnValue = false;
    e.stopPropagation();
}

การใช้งาน:

$('a').click(function (e) {
    // Execute code here
    ie8SafePreventEvent(e);
    return false;
})

preventDefaultเป็นมาตรฐานที่แพร่หลาย การใช้ adhoc ทุกครั้งที่คุณต้องการให้สอดคล้องกับ IE เวอร์ชันเก่าจะยุ่งยากกว่าการใช้ polyfill:

if (typeof Event.prototype.preventDefault === 'undefined') {
    Event.prototype.preventDefault = function (e, callback) {
        this.returnValue = false;
    };
}

สิ่งนี้จะแก้ไขต้นแบบของเหตุการณ์และเพิ่มฟังก์ชั่นนี้ซึ่งเป็นคุณสมบัติที่ยอดเยี่ยมของจาวาสคริปต์ / DOM โดยทั่วไป ตอนนี้คุณสามารถใช้ได้e.preventDefaultโดยไม่มีปัญหา

return false ในฟังของคุณควรทำงานในเบราว์เซอร์ทั้งหมด

$('orderNowForm').addEvent('submit', function () {
    // your code
    return false;
}

FWIW ในกรณีที่มีคนมาทบทวนคำถามนี้อีกครั้งคุณอาจตรวจสอบสิ่งที่คุณส่งมอบให้กับฟังก์ชั่นการจัดการ onKeyPress ของคุณ

ฉันพบข้อผิดพลาดนี้เมื่อฉันส่งผ่านผิดพลาดใน KeeyPress (นี่) แทน onKeyPress (เหตุการณ์)

ตรวจสอบอย่างอื่น

ฉันได้รับความช่วยเหลือจากวิธีการตรวจสอบฟังก์ชั่น วิธีนี้ใช้ได้ใน IE8

if(typeof e.preventDefault == 'function'){
  e.preventDefault();
} else {
  e.returnValue = false;
}