リンクをクリックするためのクリック イベントを html にアタッチしたら、クリックしたリンクを変数に配置して、後で CSS ルールを割り当てることができるようにします。
$("html").on('click', '.someclass a', function(event) {
var clickedlink = $(this);
// a long chain of conditionals and functions
$(clickedlink).css("color", "red"):
}
クリックしたリンクがサブメニュー (ul ul a) にある場合は、親リンク (ul a) も選択できるようにして、同じ css ルールを親リンクに割り当てることができるようにしたいと考えています。
私は試した
var clickedlinkparent = $(this).parent();
$(clickedlinkparent).css("color", "red");
しかし、これは何の結果にもならないので、何か間違ったことをしています。それを行う適切な方法は何ですか?
更新:メニューの構造は次のとおりです。ご覧のとおり、最も基本的なものです。
<div class="menu-container">
<ul id="menu" class="nav-menu">
<li>
<a href="http://www.someurl.com/">HOME</a>
</li>
<li>
<a>ABOUT</a>
<ul class="sub-menu">
<li><a href="http://www.someotherurl.com/">Our Company</a></li>
<li><a href="http://www.yetsomeotherurl.com/">News</a></li>
<li><a href="http://www.someevenlongerurl.com/">Events</a></li>
</ul>
</li>
</ul>
</div>
したがって、私が望むのは、Our Company リンクがクリックされたときに、Our Company と ABOUT の両方に同じ CSS が割り当てられるようにすることです。