jQuery的點擊不添加類

Question

我正在努力處理一些代碼，當我單擊<p>元素時，它具有更改iframe src的代碼，並刪除了.html文件中所有元素的“活動”類，然后將“活動”類添加到單擊的元素。

但是，“活動”類永遠不會添加到clicked元素中。

JAVASCRIPT

function loadIframe(url){
    $('.iframe_settings').attr('src', url);
    $('.nav li').removeClass('active');
    $(this).addClass('active');
};

的HTML

<li class="w-100" id="http://whatever.com/" onclick="return loadIframe(this.id);">
    <p>

        <i class="fa fa-id-badge" aria-hidden="true"></i>
        <span class="nav-label">Intranet</span>

    </p>
</li>

Answer 1

您可以將上下文（元素）傳遞給處理程序。 我希望這可以工作：

loadIframe(this.id, this)

和，

function loadIframe(url, element){
    $('.iframe_settings').attr('src', url);
    $('.nav li').removeClass('active');
    $(element).addClass('active');
};

讓我知道這是否適合您。

流浪評論：我不確定將url稱為id是否是一個好習慣。 您可能會發現數據屬性很有用。 像data-id = ""這樣的屬性。 實際上，我將其稱為data-url 。

Answer 2

您不能使用$(this).addClass();

檢查這個和這個

Answer 3

您需要以正確的方式更正代碼添加標識符。

function loadIframe(url){
    $('.iframe_settings').attr('src', url);
    $('.nav li').removeClass('active');
    $("#"+url).addClass('active');
};