jQuery Mobile - Включение неразборных элементов в разборный набор

В моем списке некоторые элементы имеют подпункты, а некоторые нет. Те, у которых нет подпунктов, должны работать как кнопки / ссылки.

К сожалению, включая элемент, как в моем наборе

<div data-role="collapsible" data-iconpos="none">
    <h3 >Title</h3>
</div>

и установка в JS а href Ссылка на нужную ссылку выглядит великолепно, но JQM вызывает событие открытия / закрытия, нажав на нее. Это меняет его внешний вид, и моя ссылка внутри элемента не работает.

У кого-нибудь есть идеи?

1 ответ

  1. Это то, что вы хотите?

    JsFiddle

    $("h3").on("click", function(e){
       $(this).parent().collapsible({collapsed: true});
    });
    

    Это предотвращает разборное открытие

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

    $(".ui-collapsible").hasClass('ui-collapsible-collapsed')
    

    и пусть он открывается, если он уже открыт, или закрывается, если он уже закрыт.

    JsFiddle

  3. Вы можете использовать это, если у вас есть кнопка внутри вашего свертываемого заголовка, и вы не хотите, чтобы складной элемент реагировал, когда вы нажимаете на кнопку, но все еще на заголовке (вне кнопки). Пример окончательной работы: JsFiddle

Изменить: Как вы просили в комментариях, вот JsFiddle со складным заголовком, открывающим веб-сайт по клику вместо того, чтобы свернуть / развернуть складной.

Пояснение:

1) Вы можете сохранить URL в атрибуте "h2" следующим образом:

<h2 data-url="google.com"; >google.com</h2> 

2) Затем вы добавляете класс, когда не хотите, чтобы заголовок свернулся / развернулся: class="doNotTriggerCollapsible"

Так что у тебя есть:

<h2 class="doNotTriggerCollapsible" data-url="google.com"; >google.com</h2> 

3) Затем вы получаете URL с помощью $(this).data("url") и открываете ссылку с помощью

window.open($(this).data("url"))
Другие вопросы по тегам