javascript - Är det möjligt att tilldela prevent default för alla händelser på ett element samtidigt?


Möjlig kopia:
jQuery - Hur kan jag binda alla händelser på ett DOM-element?

Föreställ dig, om vi vill göra ett element helt ointaktivt.

Vi skulle förstås kunna binda ett prevent default för ett klickhändelse enligt följande:

$('form *').bind('click', function(event) {
    event.preventDefault();
});

Men det är bara ett evenemang, och det finns många fler, som hover, focus, selectstart och många fler.

Vi skulle kunna specificera dem alla i en rad som 'click focus hover dblclick blur selectstart', men det är inte särskilt meningsfullt och är inte lätt att underhålla.

Så, är det möjligt att binda en händelselyssnare utan att särskilja typen av händelsen? Kanske tillåter vissa inbyggda JavaScript-lyssnare det?

Svar #1

Ingen sådan möjlighet eftersom inte alla element stöder samma händelser och inte alla händelser beter sig på samma sätt. Du måste alltid uttryckligen ange en lista över händelser, oavsett om de definieras statiskt eller dynamiskt av ett skript som genererar händelsenamn.

Även om jag länkade till ett skript som skapar en array av evenemangsnamn, görs dessa bara på ett element. Du borde naturligtvis generera detta med ett mer komplext och långsammare skript som räknar igenom alla berörda element och lägger till saknade evenemang. Att använda Javascript-objekt som associativ array för att snabbare kunna söka om ett visst evenemang har lagts till eller inte.

Ett bättre förslag

Det du försöker göra är troligtvis en kraftigt överarbetad lösning. När jag skapar ett demo klickbart gränssnitt som ska inaktivera vissa element (vare sig det är länkar, knappar eller något annat) gör jag det hellre genom att definiera en CSS-klass som inaktiverar det aktuella elementet och ha ett enkelt skript som utför inaktiveringen efteråt.

Du kan utnyttja detta ännu mer genom att även ange vilka händelser du vill inaktivera på ett visst element (med standardvärdet being en click-händelse).

<!-- no events; use defaults -->
<a href="#" class="disable">No-follow link</a>
<button class="disable">Nothing happens</button>
<!-- provide events -->
<a href="#" class="disable" data-events="click blur">No-follow link</a>
<form class="disable" data-events="submit">...</form>

Manus

$(function() {

    var disable = function(evt) {
        evt.preventDefault();
        console.log("Prevented on " + evt.target.tagName);
    };

    $(".disable").each(function() {
        var ctx = $(this);
        ctx.bind(ctx.data("events") || "click", disable);
    });
});

Använda smarta standardinställningar

Övre exemplet definierar ett enda standardhändelse. click händelse. Detta är bra och fungerar i majoriteten av fallen, men inte i alla. form-element skulle till exempel alltid behöva definiera submit händelse som bör inaktiveras. Så. Smarta standarder då. Vi bör också ta hänsyn till det faktum att listan av händelser som behöver undertryckas vanligtvis är kort. Och om vi täcker majoriteten av fallen med standarder har vi endast en liten extra kostnad på de element som faktiskt avviker från standarderna.

$(function() {

    // click is still default event
    // this object defines per element events that aren't just click
    var extraDefaults = {
        form: "submit"
    };

    var disable = function(evt) {
        evt.preventDefault();
        console.log("Prevented on " + evt.target.tagName);
    };

    $(".disable").each(function() {
        var ctx = $(this);
        ctx.bind(
            // use inline-defined events
            ctx.data("events") ||
            // use extra defaults if present
            extraDefaults[this.tagName.toLower()] ||
            // just use default click event
            "click",
            disable);
    });
});

Svar #2

Du kan binda de flesta jQuery-händelser så här :

$("#elementID").on(Object.keys(jQuery.event.fixHooks).join(" "), function(e) { 
    e.preventDefault(); 
});

Detta kommer att förhindra standardåtgärden på följande händelser:

klick dubbelklick musned musupp musrörelse musöver musut musin musut nyckelned nyckeltryck nyckelupp högerklicksmenu

FIOL