JQueryMobile добавляет событие click к кнопке вместо изменения страницы

<p><a href="index.html" data-role="button" data-icon="arrow-r" data-iconpos="right" data-theme="a" onclick="doSomething(); return false">VERIFY</a></p>

Я использую приведенный выше код, который является кнопкой jQM с набором onClick(). Вызывается onclick и выполняется doSomething(), после чего в jQM отображается сообщение об ошибке "Страница загрузки ошибок".

Как я могу подавить ошибку? В этом случае я хочу кнопку jQM, но не хочу, чтобы она меняла страницу.

Спасибо

Ответ 1

Поскольку вы используете jQuery, я бы рекомендовал использовать jQuery для подключения ваших событий. С учетом того, что использование e.preventDefault(); и e.stopImmediatePropagation(); должно остановить jQuery mobile от выполнения действия по умолчанию на <a/>.

$("#verify").click(function (e) {
    e.stopImmediatePropagation();
    e.preventDefault();
    //Do important stuff....
});

Обновить

Лучший способ использовать существующую разметку - просто добавить rel="external" к вашему <a/> И ваш onclick должен вести себя корректно.

<p>
  <a href="index.html" data-role="button" data-icon="arrow-r" data-iconpos="right" data-theme="a" onclick="doSomething(); return false" rel="external">VERIFY</a>
</p>

Это будет работать, поскольку jQuery Mobile будет обрабатывать ссылку как обычный тег <a/>, а return false просто остановит действие по умолчанию.

Ответ 2

Я думаю, ваша проблема в том, что у вас есть несколько действий на вашей кнопке и используются теги привязки. При нажатии кнопки вы вызываете страницу для перехода к index.html и событию onClick.

<a 
    href="index.html"                       <-- go to index.html
    data-role="button" 
    data-icon="arrow-r" 
    data-iconpos="right" 
    data-theme="a" 
    onclick="doSomething(); return false">  <-- Click event
VERIFY
</a>

Можете попробовать (возможно, нужно удалить/добавить некоторые другие атрибуты)

<input
    type="button"
    name="verify"
    id="verify"
    data-icon="arrow-r" 
    data-iconpos="right" 
    data-theme="a" 
    value="VERIFY" />

и теперь добавьте событие click

$('#verify').click(function() {
    alert('Button has been clicked');
});

Live Пример: http://jsfiddle.net/vRr82/2/

Ответ 3

Я думаю, вы должны добавить data-ajax="false" внутри тега привязки.. потому что в jQuery mobile переход страницы выполняется AJAX, а для перехода на страницу он должен быть ложным..

Ответ 4

Использовать функцию Jquery live. Это очень полезно для меня