Event.preventDefault () (jQuery kullanarak) çağıran bir dinleyicinin bağlantısı nasıl çözülür?

jquery toggle çağrıları varsayılan olarak preventDefault (), bu nedenle varsayılanlar çalışmaz. bir onay kutusunu tıklayamazsınız, bir bağlantıyı tıklayamazsınız vb.

varsayılan işleyiciyi geri yüklemek mümkün mü?

Benim durumumda:

$('#some_link').click(function(event){
    event.preventDefault();
});

$('#some_link').unbind('click'); varsayılan eylemi geri yüklemek için tek yöntem olarak çalıştı.

Burada görüldüğü gibi: https://stackoverflow.com/a/1673570/211514

Oldukça basit

Diyelim ki şöyle bir şey yaparsınız

document.ontouchmove = function(e){ e.preventDefault(); }

şimdi orijinal durumuna geri döndürmek için aşağıdakileri yapın ...

document.ontouchmove = function(e){ return true; }

Bu web sitesinden .

A'yı geri yüklemek mümkün değil preventDefault()ama yapabileceğiniz şey onu kandırmak :)

<div id="t1">Toggle</div>
<script type="javascript">
$('#t1').click(function (e){
   if($(this).hasClass('prevented')){
       e.preventDefault();
       $(this).removeClass('prevented');
   }else{
       $(this).addClass('prevented');
   }
});
</script>

Bir adım daha ileri gitmek isterseniz, bir olayı tetiklemek için tetik düğmesini bile kullanabilirsiniz.

function DoPrevent(e) {
  e.preventDefault();
  e.stopPropagation();
}

// Bind:
$(element).on('click', DoPrevent);

// UnBind:
$(element).off('click', DoPrevent);

bazı durumlarda * başlangıçta return falseyerine e.preventDefault(), sonra varsayılanı olarak geri yüklemek istediğinizde yapabilirsiniz return true.

* Bu, köpüren olayı önemsemediğiniz ve e.stopPropagation()birlikte kullanmadığınız zamane.preventDefault()

Ayrıca benzer soruya bakın (ayrıca Stack Overflow'da)

veya onay kutusu olması durumunda şunun gibi bir şeye sahip olabilirsiniz:

$(element).toggle(function(){
  $(":checkbox").attr('disabled', true);
  },
function(){
   $(":checkbox").removeAttr('disabled');
}) 

Bunu yaparak varsayılan eylemi geri yükleyebilirsiniz (bu bir HREF ise):

window.location = $(this).attr('href');

eğer bir bağlantı ise $(this).unbind("click");, bağlantı tıklamayı yeniden etkinleştirir ve varsayılan davranış geri yüklenir.

Bunun nasıl çalıştığını göstermek için bir demo JS keman oluşturdum :

İşte JS kemanının kodu:

HTML:

<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<a href="http://jquery.com">Default click action is prevented, only on the third click it would be enabled</a>
<div id="log"></div>

JavaScript:

<script>
var counter = 1;
$(document).ready(function(){
$( "a" ).click(function( event ) {
  event.preventDefault();

  $( "<div>" )
    .append( "default " + event.type + " prevented "+counter )
    .appendTo( "#log" );

    if(counter == 2)
    {
        $( "<div>" )
    .append( "now enable click" )
    .appendTo( "#log" );

    $(this).unbind("click");//-----this code unbinds the e.preventDefault() and restores the link clicking behavior
    }
    else
    {
        $( "<div>" )
    .append( "still disabled" )
    .appendTo( "#log" );
    }
    counter++;
});
});
</script>

Bu kodu test edin, sanırım probleminizi çözün:

event.stopPropagation();

Referans

Bunu ad alanını kullanarak yapmanın en iyi yolu. Güvenli ve emniyetli bir yoldur. Burada .rb, unbind işlevinin o belirli keydown üzerinde çalışmasını ancak diğerlerinde çalışmamasını sağlayan ad alanıdır.

$(document).bind('keydown.rb','Ctrl+r',function(e){
            e.stopImmediatePropagation();
            return false;
        });

$(document).unbind('keydown.rb');

ref1: http://idodev.co.uk/2014/01/safely-binding-to-events-using-namespaces-in-jquery/

ref2: http://jqfundamentals.com/chapter/events

Devre Dışı:

document.ontouchstart = function(e){ e.preventDefault(); }

Etkinleştirme:

document.ontouchstart = function(e){ return true; }

Etkinlik arayüzünün preventDefault () yöntemi, kullanıcı aracısına, olay açıkça işlenmezse, varsayılan eyleminin normalde olduğu gibi gerçekleştirilmemesi gerektiğini söyler. Olay dinleyicilerinden biri stopPropagation () veya stopImmediatePropagation () 'ı çağırmadığı sürece olay her zamanki gibi yayılmaya devam eder.

Olay akışının herhangi bir aşamasında preventDefault () işlevinin çağrılması olayı iptal eder, bu da olayın bir sonucu olarak uygulama tarafından normal olarak gerçekleştirilen herhangi bir varsayılan eylemin gerçekleşmeyeceği anlamına gelir.

Olayın iptal edilebilir olup olmadığını kontrol etmek için Event.cancelable'ı kullanabilirsiniz. İptal edilemeyen bir olay için preventDefault () 'u çağırmanın hiçbir etkisi yoktur.

window.onKeydown = event => {
    /*
        if the control button is pressed, the event.ctrKey 
        will be the value  [true]
    */

    if (event.ctrKey && event.keyCode == 83) {
        event.preventDefault();
        // you function in here.
    }
}

Varsayılan eyleme yalnızca bazı özel eylemler (bir formdaki aksi takdirde devre dışı bırakılmış giriş alanlarını etkinleştirin) sona erdikten sonra ihtiyacım olan bir sorun yaşadım. Varsayılan eylemi (submit ()) kendi özyinelemeli bir işleve (dosubmit ()) sardım.

var prevdef=true;
var dosubmit=function(){
    if(prevdef==true){
        //here we can do something else first//
        prevdef=false;
        dosubmit();
    }
    else{
        $(this).submit();//which was the default action
    }
};

$('input#somebutton').click(function(){dosubmit()});

Bir boole kullanın:

let prevent_touch = true;
document.documentElement.addEventListener('touchmove', touchMove, false);
function touchMove(event) { 
    if (prevent_touch) event.preventDefault(); 
}

Bunu bir Aşamalı Web Uygulamasında bazı 'sayfalarda' kaymayı / yakınlaştırmayı önlemek için kullanıyorum ve diğerlerine izin veriyorum.

2 sınıf oluşturabilirsin. JS betiğinizi bunlardan birine ayarladıktan sonra, betiğinizi devre dışı bırakmak istediğinizde, bu formdan bağlı komut dosyası içeren sınıfı silmeniz yeterlidir.

HTML:

<form class="form-create-container form-create"> </form>   

JS

$(document).on('submit', '.form-create', function(){ 
..... ..... ..... 
$('.form-create-container').removeClass('form-create').submit();

});

$('#my_elementtt').click(function(event){
    trigger('click');
});

Ne demek istediğinden emin değilim: ama işte benzer (ve muhtemelen aynı) bir sorun için bir çözüm ...

Öğeleri kesmek için genellikle preventDefault () kullanıyorum. Ancak: tek engelleme yöntemi bu değildir ... çoğu zaman, hangi davranışın daha önce olduğu gibi devam ettiğini veya durduğunu takip eden bir "soru" isteyebilirsiniz. Yakın tarihli bir vakada aşağıdaki çözümü kullandım:

$("#content").on('click', '#replace', (function(event){ return confirm('Are you sure you want to do that?') }));

Temel olarak, "varsayılanı önleme", araya girmek ve başka bir şey yapmak anlamına gelir: "onayla", ... iyi - onaylamak için tasarlanmıştır!