Подскажите пожалуйста, почему когда вывожу блок сортировки в 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');
});
...
});