Использовать jQuery нажмите, чтобы отрегулировать анкер на кнопке()
у меня есть набор динамически генерируемых тегов привязки в цикле for следующим образом:
<div id = "solTitle"> <a href = "#" id = "' + tagId + '" onClick = "openSolution();"> ' + solTitle + '</a></div> <br>';
после выполнения этого кода вывод html для одного из случаев будет выглядеть так:
<div id = "solTitle"> <a href = "#" id = "solution0" onClick = "openSolution();">Solution0 </a></div> <br>
<div id = "solTitle"> <a href = "#" id = "solution1" onClick = "openSolution();">Solution1 </a></div> <br>
Теперь я хочу, чтобы разные тексты отображались при нажатии на вышеуказанные ссылки.
openSolution () выглядит так:
function openSolution() {
alert('here');
$('#solTitle a').click(function(evt) {
evt.preventDefault();
alert('here in');
var divId = 'summary' + $(this).attr('id');
document.getElementById(divId).className = '';
});
}
когда я выполняю его и нажимаю на любую из ссылок, поток не входит в обработчик щелчка jquery. Я проверил его по приведенным выше предупреждениям используемый. Он отображает только предупреждение - "здесь", а не предупреждение - "здесь".
При нажатии на ссылку во второй раз, все отлично работает с правильным значением divId.
6 ответов:
при первом нажатии на ссылку,
openSolutionфункция выполняется. Эта функция связываетclickобработчик событий для ссылки, но он не будет ее выполнять. Во второй раз, когда вы нажимаете на ссылку,clickобработчик событий будет выполнен.то, что вы делаете, похоже, в первую очередь побеждает точку использования jQuery. Почему бы просто не привязать событие click к элементам в первую очередь:
$(document).ready(function() { $("#solTitle a").click(function() { //Do stuff when clicked }); });таким образом, вам не нужно
onClickатрибуты на вашей стихии.также похоже, что у вас есть несколько элементов с одним и тем же
idзначение ("solTitle"), которое является недопустимым. Вам нужно будет найти какую-то другую общую характеристику (classобычно хороший вариант). Если вы измените все вхожденияid="solTitle"доclass="solTitle", тогда вы можете использовать селектор класса:$(".solTitle a")так как дубликат
idзначения недопустимы, код не будет работать так, как ожидалось при работе с несколькими копиями одного и того жеid. Что имеет тенденцию бывает так, что первое вхождение элемента с этимidиспользуется, а все остальные игнорируются.
давайте возьмем тег привязки с событием onclick, который вызывает функцию Javascript.
<a href="#" onClick="showDiv(1);">1</a>теперь в javascript напишите ниже код
function showDiv(pageid) { alert(pageid); }Это покажет вам сигнал "1"....
HTML должен выглядеть так:
<div class="solTitle"> <a href="#" id="solution0">Solution0 </a></div> <div class="solTitle"> <a href="#" id="solution1">Solution1 </a></div> <div id="summary_solution0" style="display:none" class="summary">Summary solution0</div> <div id="summary_solution1" style="display:none" class="summary">Summary solution1</div>и javascript:
$(document).ready(function(){ $(".solTitle a").live('click',function(e){ var contentId = "summary_" + $(this).attr('id'); $(".summary").hide(); $("#" + contentId).show(); }); });Смотрите пример:http://jsfiddle.net/kmendes/4G9UF/
<div class = "solTitle"> <a href = "#" id = "solution0" onClick = "openSolution();">Solution0 </a></div> <br> <div class= "solTitle"> <a href = "#" id = "solution1" onClick = "openSolution();">Solution1 </a></div> <br> $(document).ready(function(){ $('.solTitle a').click(function(e) { e.preventDefault(); alert('here in'); var divId = 'summary' +$(this).attr('id'); document.getElementById(divId).className = ''; /* or $('#'+divid).removeAttr('class'); */ }); });Я изменил несколько вещей:
- удалите onclick attr и свяжите событие щелчка внутри документа.готов
- изменен solTitle, чтобы быть идентификатором класса: id не может быть повторен
вы не можете иметь несколько раз один и тот же идентификатор для элементов. Это предназначается, чтобы быть уникальным.
используйте класс и сделайте свои идентификаторы уникальными:
<div class="solTitle" id="solTitle1"> <a href = "#" id = "solution0" onClick = "openSolution();">Solution0 </a></div>и использовать селектор класса:
$('.solTitle a').click(function(evt) { evt.preventDefault(); alert('here in'); var divId = 'summary' + this.id.substring(0, this.id.length-1); document.getElementById(divId).className = ''; });
вы назначаете
onclickсобытие внутри функции. Это означает, что как только функция выполнена один раз, второйonclickсобытие также назначается элементу.назначить функцию
onclickили использовать jqueryclick().нет необходимости иметь как
Comments