Normal click davranışını geçersiz kılan bir preventDefault'a neden yol açtığını nasıl bulabilirim

Question

Bazı büyük kod parçalarını devraldım. Genelde e.preventDefault() genelleştirilmiş bir yol, bir çapa tıklamasının normal davranışını yasaklıyor.

Belirli bir bağlantıya tıklandığında ne olduğunu görmek için Chrome webtools'ta profesör çalıştırmayı düşündüm ve suçlu beyanına geri dönmeyi umuyordum. Ancak çok fazla şansım olmadı

Chrome webtools'ta bir bağlantı tıklandığında normal tıklama davranışını geçersiz kılan bir ifadeyi nasıl geri alabilirim (mümkünse)? (jQuery kullanıyorum)

Answer 1

Sen Event.prototype.preventDefault geçersiz kılmak ve ilk satır olarak debugger ifadeyi eklemek gerekir.

Aşağıdakileri konsoldan çalıştırın.

var oldEPD = Event.prototype.preventDefault; 
Event.prototype.preventDefault = function() { 
    debugger; 
    oldEPD.call(this); 
}; 

Answer 2

Belki de kodunuzu e.preventDefault numaralı telefondan arayın ve bu satıra bir kesme noktası ekleyin. Kesme noktası tetiklendiğinde çağrı yığınını okuyabilir ve hangi kodun tıklamayı geçersiz kılabildiğini görebilirsiniz. ,

<a href="#" onclick="DoSomething(); return false;"></a> 

Bunu yaparsanız: Burada çeşitli preventDefault() cevaplara ek olarak

Answer 3

, ayrıca HTML kodunda ise, böyle, senin bağlantının OnClick olay işleyicisi false dönen görebiliyorum sadece (varsayılan olarak true var) kaldırın:

<a href="#" onclick="DoSomething()"></a> 

Answer 4

Teknofobar yanıtı temel alınarak, olayla ilgili sorunların hatalarını ayıklamak için oldukça kullanışlıdır. Webpack/Babel gibi bir modern env JS kullanmayı beklediğinize dikkat edin, ancak aynı işi daha eski JS sözdizimi ile de yapabilirsiniz.

Temel olarak mesajlaşma mesajı daha kullanıcı dostu dışında aynıdır. bölüm # nav bar> a.Tappable-inactive.group-link.nav-bar-öğe üzerinde()

click.stopPropagation: Ben Sorun debug yardımcı olacak bir "anlamlı seçici" hesaplamak için deneyin .my-ana-takımda> div.nav bar maddelik-content> svg

// Logs all calls to preventDefault/stopPropagation in an user-friendly way 
if (process.env.NODE_ENV !== "production") { 
    (function monkeyPatchEventMethods() { 

    const logEventMethodCall = (event,methodName) => { 
     const MinimumMeaninfulSelectors = 3; // how much meaningful items we want in log message 
     const target = event.target; 

     const selector = (function computeSelector() { 
     const parentSelectors = []; 
     let node = target; 
     let minimumSelectors = 0; 
     do { 
      const meaningfulSelector = node.id ? 
      `#${node.id}` : node.classList.length > 0 ? 
       `.${Array.prototype.join.call(node.classList, '.')}` : undefined; 
      if (meaningfulSelector) minimumSelectors++; 
      const nodeSelector = `${node.tagName.toLowerCase()}${meaningfulSelector ? meaningfulSelector : ''}`; 
      parentSelectors.unshift(nodeSelector); 
      node = node.parentNode; 
     } while (node && node !== document && minimumSelectors < MinimumMeaninfulSelectors); 
     return parentSelectors.join(" > "); 
     })(); 

     console.debug(`${event.type}.${methodName}() on ${selector}`,event); 
    }; 

    const preventDefault = Event.prototype.preventDefault; 
    Event.prototype.preventDefault = function() { 
     logEventMethodCall(this,'preventDefault'); 
     preventDefault.call(this); 
    }; 

    const stopPropagation = Event.prototype.stopPropagation; 
    Event.prototype.stopPropagation = function() { 
     logEventMethodCall(this,'stopPropagation'); 
     stopPropagation.call(this); 
    }; 

    })(); 
} 

https://gist.github.com/slorber/b1c0ffef56abd449c05476b5c609a36e