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. Это очень полезно для меня