Bagaimana cara mencegah penanganan acara default dalam metode onclick?

Bagaimana cara mencegah default dalam metode onclick? Saya memiliki metode di mana saya juga meneruskan nilai khusus

<a href="#" onclick="callmymethod(24)">Call</a>

function callmymethod(myVal){
    //doing custom things with myVal
    //here I want to prevent default
}

Biarkan callback Anda kembali falsedan teruskan ke onclickhandler:

<a href="#" onclick="return callmymethod(24)">Call</a>

function callmymethod(myVal){
    //doing custom things with myVal
    //here I want to prevent default
    return false;
}

Namun, untuk membuat kode yang dapat dipelihara , Anda harus tidak menggunakan "Javascript inline" (yaitu: kode yang langsung berada di dalam tag elemen) dan mengubah perilaku elemen melalui file sumber Javascript yang disertakan (disebut Javascript yang tidak mengganggu ).

Mark-up:

<a href="#" id="myAnchor">Call</a>

Kode (file terpisah):

// Code example using Prototype JS API
$('myAnchor').observe('click', function(event) {
    Event.stop(event); // suppress default click behavior, cancel the event
    /* your onclick code goes here */
});

Menurut saya jawabannya salah! Dia bertanya event.preventDefault();kapan Anda membalas salah; itu menyebut event.preventDefault();DAN event.stopPropagation();juga!

Anda bisa mengatasinya dengan ini:

<a href="#" onclick="callmymethod(event, 24)">Call</a>

function callmymethod(e, myVal){
    //doing custom things with myVal

    //here I want to prevent default
    e = e || window.event;
    e.preventDefault();
}

Coba ini (tetapi gunakan tombol untuk kasus seperti itu jika Anda tidak memiliki hrefnilai yang valid untuk degradasi yang anggun )

<a href="#" onclick="callmymethod(24); return false;">Call</a>

Anda dapat menangkap acara tersebut dan kemudian memblokirnya dengan preventDefault () - berfungsi dengan Javascript murni

document.getElementById("xyz").addEventListener('click', function(event){
    event.preventDefault();
    console.log(this.getAttribute("href"));
    /* Do some other things*/
});

Letakkan saja "javascript: void (0)", di tempat "#" di tag href

<a href="javascript:void(0);" onclick="callmymethod(24)">Call</a>

Ini berhasil untuk saya

<a href="javascript:;" onclick="callmymethod(24); return false;">Call</a>

Kamu dapat memakai:

event.stopPropagation();

https://dom.spec.whatwg.org/#dom-event-stoppropagation

Cara lain untuk melakukannya adalah dengan menggunakan eventobjek di dalam atribut onclick(tanpa perlu menambahkan argumen tambahan ke fungsi untuk melewatkan acara)

function callmymethod(myVal){
    console.log(myVal);
}

<a href="#link" onclick="event.preventDefault();callmymethod(24)">Call</a>

Akan terlalu membosankan untuk mengubah penggunaan fungsi di semua halaman html menjadi return false.

Jadi, berikut adalah solusi teruji yang hanya menambal fungsi itu sendiri:

function callmymethod(myVal) {
    // doing custom things with myVal

    // cancel default event action
    var event = window.event || callmymethod.caller.arguments[0];
    event.preventDefault ? event.preventDefault() : (event.returnValue = false);

    return false;
}    

Hal ini dengan benar mencegah IE6, IE11, dan Chrome terbaru untuk mengunjungi href="#"setelah pengendali kejadian onclick selesai.

Kredit:

• Bagaimana Anda mengetahui fungsi pemanggil di JavaScript?
• Fungsi event.preventDefault () tidak bekerja di IE

Jika Anda perlu memasukkannya ke dalam tag. Bukan solusi terbaik, tapi itu akan berhasil.

Pastikan Anda meletakkan acara onclick di depan href. Hanya bekerja untuk saya seperti ini.

<a onclick="return false;" href="//www.google.de">Google</a>

Berikan kelas atau id ke elemen tersebut dan gunakan fungsi jquery unbind ();

$(".slide_prevent").click(function(){
                $(".slide_prevent").unbind();
              });