Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   HTML-элемент не реагирует на клик, в PHP (https://javascript.ru/forum/dom-window/65548-html-ehlement-ne-reagiruet-na-klik-v-php.html)

DDim1000 25.10.2016 10:16

HTML-элемент не реагирует на клик, в PHP
 
Подскажите пожалуйста, почему когда вывожу блок сортировки в php, кнопки вида вывода товара перестают работать? т.е., перестают реагировать на клик.
Вот так все работает:

<html>...
<div id="block-sorting">
<p id="nav-breadcrumbs"><a href="index.php">Главная страница</a> \ <span>Все товары</span> </p>
<ul id="options-list">
<li>Вид: </li>
<li><img id="style-grid" src="img/icon-grid.png" /> </li>
<li><img id="style-list" src="img/icon-list.png" /> </li>
...
</ul>
</li>
</ul>
</div>
...
</html>


А так не работает:

<?php 
echo ' 
 <div id="block-sorting"> 
<p id="nav-breadcrumbs"><a href="index.php">Главная страница</a> \ <span>Все товары</span> </p> 
<ul id="options-list"> 
<li>Вид: </li> 
<li><img id="style-grid" src="img/icon-grid.png" /> </li> 
<li><img id="style-list" src="img/icon-list.png" /> </li> 
... 
</ul> 
</li> 
</ul> 
</div> 
         
     ';    ?>

JS:

$(document).ready(function(){
...
$("#style-grid").click(function(){

	$("#block-tovar-list").hide();
	$("#block-tovar-grid").show();
	
	$("#style-grid").attr("src","img/icon-grid-active.png");
	$("#style-list").attr("src","img/icon-list.png");
	
	localStorage.setItem('select_style','grid'); 
	});	
	
$("#style-list").click(function(){
	
	$("#block-tovar-grid").hide();
	$("#block-tovar-list").show();
	
	$("#style-grid").attr("src","img/icon-grid.png");		
	$("#style-list").attr("src","img/icon-list-active.png");

    localStorage.setItem('select_style','list');
	});	
...
});

ksa 25.10.2016 13:26

DDim1000, могу предположить, что на момент "навешивания" событий этих элементов просто еще нет на странице...


Часовой пояс GMT +3, время: 03:20.