Использовать 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.

473   6  

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'); */

    });
 });

Я изменил несколько вещей:

  1. удалите onclick attr и свяжите событие щелчка внутри документа.готов
  2. изменен 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 или использовать jquery click().

нет необходимости иметь как

Comments

    Ничего не найдено.