我有一個jQuery Mobile的導航欄有兩個標籤:jQuery Mobile的導航欄:讓活動標籤
<div data-role="navbar">
<ul>
<li><a href="#" class="tab ui-btn-active">Inbound</a></li>
<li><a href="#" class="tab">Outbound</a></li>
</ul>
</div>
當點擊一個標籤,我想
- 做什麼,如果它已經激活的標籤,
- 如果點擊的選項卡變爲新的活動選項,則會執行某些操作。
按照documentation,主動標籤具有ui-btn-active
課,所以我聽的點擊,看看有沒有類是出現在點擊按鈕:
$('.tab').click(function() {
if ($(this).hasClass('ui-btn-active')) {
// already active, do nothing
console.log("already active");
} else {
// newly active, do something
console.log("newly active");
}
});
這已經完美工作了幾個月,但我現在看到,它完全依賴於何時將活動類從一個類中移除並添加到另一個類中的時間,相對於評估if
時的時間。現在,在一些不相關的代碼發生變化後,它在桌面瀏覽器上的運行方式與之前相同,但在移動瀏覽器上,無論點擊哪個按鈕,我只獲得,即if
發生得太晚。
最聰明的方法是什麼?有人可以解釋事件的順序,以及事件發生順序的不一致如何發生? click
是否是正確的聽衆用於觸摸屏設備?
編輯:
我嘗試使用.on()
和檢查事件對象監聽父的冒泡事件,希望它含有會更準確的班級名單,但行爲是一樣的:
$('ul').on('click','a',function(event) {
alert(event.currentTarget.classList.contains('ui-btn-active'));
});
單擊非活動選項卡將返回false
在桌面瀏覽器上,如希望,和true
在移動瀏覽器上。