Селектор jQuery .bind ()

Question

Я пытаюсь связать событие щелчка с привязкой, и я не могу определить правильный селектор ... Является ли bind () особенно требовательным к селекторам?

Вот мой код, который не работает:

$(".ui-navbar").delegate("a.location-menu-btn", "click", function() {
    navigateToPage("location.html", { });
});

Следующий код работает, но заставляет все тело выглядеть так, как будто его нажимают на смартфоне Android (уродливая желтая рамка вокруг анахора).

$("body").delegate("a.location-menu-btn", "click", function() {
    navigateToPage("location.html", { });
});

Это HTML:

<div data-role="navbar" class="ui-navbar ui-navbar-noicons" role="navigation">
                        <ul class="ui-grid-b">
                            <li class="ui-block-a">
                                <a href="javascript:void(0)" data-ajax="false" class="search-menu-btn ui-btn ui-btn-up-a" data-theme="a"><span class="ui-btn-inner"><span class="ui-btn-text"><span class="lang-nav-search">Search</span></span></span></a>
                            </li>
                            <li class="ui-block-b">
                                <a href="javascript:void(0)" data-ajax="false" class="location-menu-btn ui-btn ui-btn-up-a" data-theme="a"><span class="ui-btn-inner"><span class="ui-btn-text"><span class="lang-nav-location">Location</span></span></span></a>
                            </li>
                            <li class="ui-block-c">
                                <a href="javascript:void(0)" data-ajax="false" class="settings-menu-btn ui-btn ui-btn-up-a" data-theme="a"><span class="ui-btn-inner"><span class="ui-btn-text"><span class="lang-nav-settings">Settings</span></span></span></a>
                            </li>
                        </ul>
                    </div>

Answer 1

live устарело.Вместо этого используйте on.

Answer 2

Если вы хотите, чтобы в элементах привязки в .ui-navbar было событие click, а HTML-код - это статический HTML-код, существующий во время загрузки страницы, вы можете просто использовать это:

$(document).ready(function() {
    $(".ui-navbar a").click(function() {
        navigateToPage("location.html", { });
    });
});

Это сделает теги <a> в этом фрагменте вашего HTML кликабельными. Но эти теги <a> не имеют содержимого и, следовательно, не имеют размера, поэтому никто не сможет нажимать на них, пока вы не предоставите им некоторое содержимое.

Если ваша проблема не в этом, пожалуйста, объясните.

Если содержимое добавляется динамически с помощью скрипта, вы можете использовать .live () следующим образом:

$(document).ready(function() {
    $(".ui-navbar a").live("click", function() {
        navigateToPage("location.html", { });
    });
});