2012-07-04 3 views
1

У меня есть JQuery, что делает ссылки, но ссылка они должны вызвать более JQuery, но они не делают, вот код:JQuery ссылка не работает

$(".divisionLinks").click(function() { 
    $('.show_hide_division').show(); 
    $('.show_hide_main').html($(this).html()+ " is Selected"); 
    //Load the division xml 
    var xmlDoc=new ActiveXObject("Microsoft.XMLDOM"); 
    xmlDoc.async="false"; 
    xmlDoc.load("xml//division//"+ $(this).html() + ".xml"); 
    theEnvNodes = xmlDoc.getElementsByTagName('ENVIRONMENT'); 
    //Make the html 
    theNewHTML = "<ul>"; 
    for (i = 0; i<theEnvNodes.length; i++){ 
    theNewHTML = theNewHTML + "<li><a class=\"environmentLinks\" href=\"#\">"; 
    theNewHTML = theNewHTML + theEnvNodes[i].childNodes[0].childNodes[0].nodeValue; 
    theNewHTML = theNewHTML + "</a></li>"; 
    } 
    theNewHTML = theNewHTML + "</ul>"; 
    $('.environmentButtons').html(theNewHTML); 
}); 
$(".environmentLinks").click(function() { 
    $('.show_hide_environment').show(); 
    $('.show_hide_division').html($(this).html()+ " is Selected"); 
}); 

Так разделение ссылка работает, но ссылки на среду нет. Я читал, это может быть что-то с jQuery, индексирующим класс .environmentLink. Но я не знаю и не знаю, как работать. Спасибо за вашу помощь заранее.

ответ

1

Вы должны использовать, например:

$(".environmentLinks").live('click', function() { 
    $('.show_hide_environment').show(); 
    $('.show_hide_division').html($(this).html()+ " is Selected"); 
}); 

или:

$("body").on('click', ".environmentLinks", function() { 
    $('.show_hide_environment').show(); 
    $('.show_hide_division').html($(this).html()+ " is Selected"); 
}); 
+0

['live()'] (http://api.jquery.com/live/) ** устарел **, прочитал API. Прежде чем использовать jQuery 1.7 ['delegate()'] (http://api.jquery.com/delegate/) и в 1.7+ ['on()'] (http://api.jquery.com/on /). –

+0

Спасибо, live() работал, но on() не –

+0

Вы приветствуете, я делаю небольшую синтаксическую ошибку в '.on()' example, я ее редактирую :) –

0

подмигнули, потому что окружающая среда ссылки генерируются позже и ваша функция Клик привязанные к DOM, я думаю.

Попробуйте это:

$(".environmentLinks").live("click", function(){ 

$('.show_hide_environment').show(); 
$('.show_hide_division').html($(this).html()+ " is Selected"); 
}); 

Это будет "освежить" ваши события щелчка.

1

Поскольку вы добавляете .environmentLinks динамически, событие click, которое у вас есть, не привязывается, поскольку эти ссылки не существуют при загрузке страницы. Если вы используете последнюю версию jQuery, используйте .on(), чтобы связать событие click с ссылками .environmentLinks.

$("body").on('click', '.environmentLinks', function() { 
    $('.show_hide_environment').show(); 
    $('.show_hide_division').html($(this).html()+ " is Selected"); 
}); 

В идеале вы хотите заменить $ («тело») с родительским элементом .environmentLinks, который находится ближе к нему, чем элемент тела.

Обработчики событий привязаны только к выбранным в данный момент элементам; они должны существовать на странице в то время, когда ваш код делает звонок .on(). Чтобы убедиться, что элементы присутствуют и могут быть выбраны, выполните событие , связанное внутри документа, готового обработчика для элементов, которые находятся в HTML-разметке на странице. Если на страницу вводится новый HTML-код, выбирает элементы и присоединяет обработчики событий после того, как новый HTML-код помещается на страницу. Или используйте делегированные события для присоединения обработчика события , как описано ниже.

Смежные вопросы