Проверка элемента на существование в цикле
Здравствуйте
так я проверяю существование элемента на странице:
<script type="text/javascript">
$(".zzz").live('click', function(){
if($(".ymaps-2-1-47-button__text").length>0) {
alert('есть');
};
});
</script>
<div class="zzz">проверка на существование</div> но проверяемый элемент загружается динамически, через какое-то неопределенное время помогите пожалуйста, сделать проверку элемента в цикле - проверять до тех пор, пока проверяемый элемент (.ymaps-2-1-47-button__text) не загрузится на страницу, после чего показать алерт |
Либо отложить проверку до загрузки всех элементов,
либо если вам надо вызывать функцию после загрузки элемента используйте такую конструкцию
$(элем).ready(function() {
если элемент грузится аяксом используйте колбек! А то что вы хотите сделать это плохо! |
Цитата:
Это делается с использованием setTimeout() ;) |
Цитата:
|
j0hnik, ksa, laimas, подробнее - по клику на ссылку, на страницу загружается яндекс карта. Когда карта полностью загрузится, загрузится и элемент (кнопка на карте) с классом .ymaps-2-1-47-button__text Вот этот момент нужно отследить и показать алерт после загрузки .ymaps-2-1-47-button__text
Как в этом случае использовать setTimeout() я не понял |
rodiony4,
document.addEventListener("DOMNodeInserted", function (e) {
if ( e.target.classList.contains("ymaps-2-1-47-button__text") ) {
// ваш код
}
});
|
Diphenyl Oxalate, я наверное сделал что-то не так, ваша функция не выполняется. посмотрите? http://www.specglass.ru/Untitled-2.html
|
rodiony4,
мой недосмотр - не учёл, что элемент с нужным классом может быть вложенным.
document.addEventListener("DOMNodeInserted", function (e) {
if ( e.target.nodeType != 1 ) return;
if ( e.target.classList.contains("ymaps-2-1-47-button__text") || e.target.getElementsByClassName("ymaps-2-1-47-button__text").length ) {
alert("Ура!");
}
});
|
Diphenyl Oxalate, спасибо, вместо алерта добавляю уже на загруженную карту див:
document.addEventListener("DOMNodeInserted", function (e) {
if ( e.target.nodeType != 1 ) return;
if ( e.target.classList.contains("ymaps-2-1-47-button__text") || e.target.getElementsByClassName("ymaps-2-1-47-button__text").length ) {
$(".cap_site_map").append("<div class='close_map_x'>Закрыть</div>");
}
});
все выполняется, но только один раз (проверял в опера, мозила, хром, ie) например, кликаю по кнопке map (.cap_contact_1) - загружается карта, после того как карта загрузилась - добавляется мой див Закрыть карту (.close_map_x) кликаю на див .close_map_x - карта закрывается, все ОК но в дальнейшем при клике по кнопке map (.cap_contact_1) - файербаг показывает TypeError: can't access dead object вот пример http://www.specglass.ru/Untitled-2.html |
Diphenyl Oxalate, ваш код js выполняется, это у меня небольшой косяк, в функции, где кнопка закрытия карты:
$(".close_map_x").live('click', function(){
$(".cap_site_map").fadeOut(600);
});
если заменить
$(".cap_site_map").fadeOut(600);
на
$(".cap_site_map").html("");
то все работает корректно буду благодарен, если объясните, почему возникала ошибка с fadeOut Вам большое спасибо за помощь! обновленный пример http://www.specglass.ru/Untitled-2.html |
if (window.MutationObserver) {
//используем MutationObserver
} else //иначе используем DOMNodeInserted
|
Цитата:
|
ksa, так?
<script type="text/javascript">
function find_map_element(){
if($(".ymaps-2-1-47-button__text").length>0){
alert('есть');
clearInterval(interval_find_map_element);
};
};
$(".мояКнопка").click(function(){
find_map_element();
interval_find_map_element = setInterval(find_map_element, 1);
});
</script>
|
Цитата:
|
ksa, спасибо!
|
| Часовой пояс GMT +3, время: 09:10. |