jQuery로 기본 링크 클릭 동작을 중지하는 방법

웹 페이지에 링크가 있습니다. 사용자가 클릭하면 페이지의 위젯이 업데이트됩니다. 그러나 이벤트가 발생하기 전에 기본 기능 (다른 페이지로 이동)이 발생하기 때문에 뭔가를하고 있습니다.

링크는 다음과 같습니다.

<a href="store/cart/" class="update-cart">Update Cart</a>

다음은 jQuery의 모습입니다.

$('.update-cart').click(function(e) { 
  e.stopPropagation(); 
  updateCartWidget(); 
});

무엇이 문제입니까?

e.preventDefault();

에서 https://developer.mozilla.org/en-US/docs/Web/API/event.preventDefault

이벤트의 추가 전파를 중지하지 않고 취소 가능한 경우 이벤트를 취소합니다.

$('.update-cart').click(function(e) {
    updateCartWidget();
    e.stopPropagation();
    e.preventDefault();
});

$('.update-cart').click(function() {
    updateCartWidget();
    return false;
});

다음 방법은 똑같은 결과를 얻습니다.

e.preventDefault()기본 기능이 발생하지 않도록 하려고 합니다.

또는 return false당신의 방법에서 가져옵니다.

preventDefault기본 기능을 stopPropagation방지하고 이벤트가 컨테이너 요소로 버블 링되는 것을 방지합니다.

e.preventDefault();대신 사용할 수 있습니다.e.stopPropagation();

이 코드는 모든 이벤트 리스너를 제거합니다.

var old_element=document.getElementsByClassName(".update-cart");    
var new_element = old_element.cloneNode(true);
old_element.parentNode.replaceChild(new_element, old_element);