Я ленивый. Там! Это вне пути.
У меня есть список элементов неопределенной длины, которые я хотел бы отобразить в HTML. Я хочу показать часть каждого элемента, а затем добавить ссылку «показать больше» в каждом элементе, которая будет отображать больше элементов. Поскольку ссылка «показать больше» реализует ту же функциональность, я связал ту же функцию обработчика кликов с «показать больше ссылки», которая затем показывает HTML-диапазон, содержащий скрытый текст. Мой код выглядит так:
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
</head>
<body>
<p>List of stuff</p>
<ul>
<li> One <a href="#" class="showmore_link">show more</a> <span class="showmore" style="display:none"> More about One </span></li>
<li> Tow <a href="#" class="showmore_link">show more</a> <span class="showmore" style="display:none"> More about Two </span></li>
<li> Three <a href="#" class="showmore_link">show more</a> <span class="showmore" style="display:none"> More about Three </span></li>
</ul>
<script type="text/javascript">
$(document).ready(function() {
$(".showmore_link").click(show_more_toggle);
});
show_more_toggle=function(){
$(".showmore").slideToggle();
}
</script>
</body>
</html>
Когда я нажимаю ссылку «показать больше», она показывает все три диапазона класса «showmore». Как я могу настроить обработчик кликов "show_more_toggle", чтобы он только открывал диапазон в том же элементе списка?
CONSTRAINT: я не могу использовать атрибуты "id" в диапазонах или элементах списка по другим причинам.