jquery - 「.ul li」内の「a」タグで「event.preventDefault」を呼び出すにはどうすればよいですか?

Question

以下のコードブロックでは、内のタグを呼び出しevent.preventDefaultて、リスト要素をクリックしたときにタグがその属性のページにリダイレクトされないようにします。やってみましたが、エラーになります。どうすればこれを行うことができますか？a.ul liahref$this.find("a").preventDefault();

$(document).ready(function () {
    $(".ul li").on("click", function () {
        var $this = $(this);
        $this.find("a").preventDefault();

        // switch all lists off 
        $(".selectedList, .checkedList").removeClass("selectedList, checkedList");
        // switch this list on  
        $this.addClass("selectedList, checkedList");
    });
});

score 2 · Accepted Answer

要素ではなくイベントオブジェクトでevent.preventDefaultを使用できますDOM。イベントクリックイベントをに追加して呼び出すことで、トリックを行うことができますpreventDefault

$(".ul li a").click(function(event){    
     event.preventDefault();    
});

score 2 · Accepted Answer

$(".ul li a").on("click", function(e)
{
    var $this = $(this);
    e.preventDefault();

    $(".selectedList, .checkedList").removeClass("selectedList, checkedList");
    // switch this list on  
    $this.parent().addClass("selectedList, checkedList");//or parents('li')
});

最後に.parentif ais の直接の子をli使用.parents('li')するか、に追加classするために使用しparent liます。

また

closest('li')うまくいきます。

score 1 · Accepted Answer

イベントオブジェクトでpreventDefault()を呼び出す必要があります。

,addClass の使用法も間違っていると思います。複数のクラスを追加/削除する場合は、クラス名の間に何もないはずです

$(document).ready(function() {
        $(".ul li a").on("click", function(e) {
            var $this = $(this);
            e.preventDefault();

            // switch all lists off 
            $(".selectedList, .checkedList").removeClass("selectedList checkedList");
            // switch this list on  
            $this.addClass("selectedList checkedList");
        });
    });

score 0 · Accepted Answer

イベントオブジェクト. preventDefault()はイベント用です。

$(document).ready(function() {
        $(".ul li").on("click", function(evt) {
            var $this = $(this);
            evt.preventDefault(); // this should be like this. 

            // switch all lists off 
            $(".selectedList, .checkedList").removeClass("selectedList, checkedList");
            // switch this list on  
            $this.addClass("selectedList, checkedList");
        });
    });

score 0 · Accepted Answer

クリックイベントにはa要素を使用するだけです

$(document).ready(function() {
    $(".ul li a").on("click", function( e ) {
        var $this = $(this);
        e.preventDefault();

        // switch all lists off 
        $(".selectedList, .checkedList").removeClass("selectedList, checkedList");
        // switch this list on  
        $this.parent( 'li' ).addClass("selectedList, checkedList");
    });
});

score 0 · Accepted Answer

関数は、最初の引数としてイベントハンドラー関数に渡される.preventDefault()jQuery 正規化オブジェクトに属します。event無名関数のパラメーターに名前を指定して使用するだけです。

$(document).ready(function() {
    $(".ul li").on("click", function(event) {
        var $this = $(this);
        event.preventDefault();

        // switch all lists off 
        $(".selectedList, .checkedList").removeClass("selectedList checkedList");
        // switch this list on  
        $this.addClass("selectedList checkedList");
    });
});

イベントのバブリングによりclick、要素でトリガーされたすべてのイベント<a>も、このイベントハンドラーによって処理される必要があります。また、.addClass()および.removeClass()関数を使用する場合、クラス名のリストはコンマではなくスペースで区切られていることに注意して"selectedList checkedList"ください。"selectedList, checkedList"クラスがselectedList,.

jquery - 「.ul li」内の「a」タグで「event.preventDefault」を呼び出すにはどうすればよいですか?

6 に答える 6

Related

Reference