Materialize.css - 指定された要素（アンカータグ）のリップル効果/波効果を無効にするにはどうすればよいですか？

Question

私は波紋エフェクト/波の効果を指定されたアンカータグから削除しようとしていますが、それを達成することはできません。何か案は？

アンカータグ：

<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink3" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> 
     <span>My Policies</span> 
     <i class="fa fa-angle-down" aria-hidden="true"></i><i class="fa fa-plus"></i> 
    </a> 

クラス「波効果波光」は、このように動的に追加されます：

<a class="nav-link dropdown-toggle waves-effect waves-light" href="#" id="navbarDropdownMenuLink3" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"> 
    <span>My Policies</span> 
    <i class="fa fa-angle-down" aria-hidden="true"></i><i class="fa fa-plus"></i> 
</a> 

Answer 1

追加または削除するにはjQueryの.addClass()と.removceClass()方法を使用することができますクラスからのクラス。

あなたの場合、アンカータグにリップルエフェクトを追加します。そのアンカータグにidを割り当てて、メソッドを追加するか、または.removeClass()メソッドを使用してリップルエフェクトを削除します。

デモ：https://jsfiddle.net/Tirth_Patel/s52ko6eo/

だから、あなたのクラスを追加/削除するbutton click, page loadのようなイベントをトリガすることができます（waves-effect waves-light）

私はjsfiddleを見てみましょう作成しました

例：

HTML

<a class="blue nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink3" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> 

    <span>My Policies</span> 

    <i class="fa fa-angle-down" aria-hidden="true"></i> 
    <i class="fa fa-plus"></i> 

</a> 

<br><button id="btn" class="btn">Add Ripple</button> 

<br><br><button id="btn2" class="btn">Remove Ripple</button> 

jQueryの

$(document).ready(function(){ 

    // Adds `waves-effect wave-light` class to `anchor` 
    $('#btn').click(function(){ 

     $('#navbarDropdownMenuLink3').addClass('waves-effect waves-light'); 
    }); 


    // Removes `waves-effect wave-light` class from `anchor` 
    $('#btn2').click(function(){ 

     $('#navbarDropdownMenuLink3').removeClass('waves-effect waves-light'); 

    }); 

});