获取已单击ul的li's列表
Get list of li's of clicked ul
我有一个如下所示的列表结构,我想在单击'cssmenu3'类<ul>
s时获取<li>
标记的文本,但代码
小提琴在这里:http://jsfiddle.net/sadaf2605/74jYb/6/
我正在尝试的代码:
$(".cssmenu2 li").click(function () {
$("#hello").append("started");
var optionTexts = [1, 2];
$(this).children().each(function () {
optionTexts.push($(this).text());
});
alert(optionTexts.length);
optionTexts.each(
function () {
$("#hello").append(this);
}
);
});
<div style="float:left; background-color:yellow; width:1200px; height:200px;" id="hello"></div>
<div id="top_cssmenu" style="float:left;">
<div id='cssmenu'>
<ul class="cssmenu1">
<li data-url="news.html" class='active has-sub'><a>Bangladeshi</a>
<ul class="cssmenu2">
<li data-url="news.html"><a href='#'>Artist Name</a>
<ul class="cssmenu3">
<li data-url="news.html"><a href='#'>Artist sub</a>
</li>
<li data-url="news.html"><a href='#'>Artist sub</a>
</li>
</ul>
</li>
<li data-url="news.html" class="has-sub"><a href='#'>Artist Name</a>
<ul class="cssmenu3">
<li data-url="news.html"><a href='#'>Artist sub</a>
</li>
<li data-url="news.html"><a href='#'>Artist sub</a>
</li>
</ul>
</li>
<li data-url="news.html"><a href='#'>Artist Name</a>
<ul class="cssmenu3">
<li data-url="news.html"><a href='#'>Artist sub</a>
</li>
<li data-url="news.html"><a href='#'>Artist sub</a>
</li>
</ul>
</li>
<li data-url="news.html"><a href='#'>Artist Name</a>
</li>
<li data-url="news.html"><a href='#'>Artist Name</a>
</li>
<li data-url="news.html"><a href='#'>Artist Name</a>
</li>
<li data-url="news.html"><a href='#'>Artist Name</a>
</li>
<li data-url="news.html"><a href='#'>Artist Name</a>
</li>
<li data-url="news.html"><a href='#'>Artist Name</a>
</li>
<li data-url="news.html"><a href='#'>Artist Name</a>
</li>
<li data-url="news.html" class="has-sub"><a href='#'>Artist Name</a>
</li>
</ul>
</li>
<li class='has-sub menu_news'><a href='#'>West Bengal</a>
<ul class="cssmenu2">
<li data-url="news.html"><a href='#'>Artist Name</a>
<ul class="cssmenu3">
<li data-url="news.html"><a href='#'>Artist sub</a>
</li>
<li data-url="news.html"><a href='#'>Artist sub</a>
</li>
</ul>
</li>
<li data-url="news.html" class="has-sub"><a href='#'>Artist Name</a>
<ul class="cssmenu3">
<li data-url="news.html"><a href='#'>Artist sub</a>
</li>
<li data-url="news.html"><a href='#'>Artist sub</a>
</li>
</ul>
</li>
<li data-url="news.html"><a href='#'>Artist Name</a>
<ul class="cssmenu3">
<li data-url="news.html"><a href='#'>Artist sub</a>
</li>
<li data-url="news.html"><a href='#'>Artist sub</a>
</li>
</ul>
</li>
</ul>
</li>
<li class='has-sub menu_news'><a href='#'>Other</a>
<ul class="cssmenu2">
<li data-url="news.html"><a href='#'>Artist Name</a>
<ul class="cssmenu3">
<li data-url="news.html"><a href='#'>Artist sub</a>
</li>
<li data-url="news.html"><a href='#'>Artist sub</a>
</li>
</ul>
</li>
<li data-url="news.html"><a href='#'>Artist Name</a>
</li>
<li data-url="news.html"><a href='#'>Artist Name</a>
</li>
<li data-url="news.html"><a href='#'>Artist Name</a>
</li>
<li data-url="news.html"><a href='#'>Artist Name</a>
</li>
<li data-url="news.html"><a href='#'>Artist Name</a>
</li>
<li data-url="news.html"><a href='#'>Artist Name</a>
</li>
<li data-url="news.html"><a href='#'>Artist Name</a>
</li>
<li data-url="news.html" class="has-sub"><a href='#'>Artist Name</a>
</li>
<ul class="cssmenu3">
<li data-url="news.html"><a href='#'>Artist sub</a>
</li>
<li data-url="news.html"><a href='#'>Artist sub</a>
</li>
</ul>
</li>
<li data-url="news.html"><a href='#'>Artist Name</a>
<ul class="cssmenu3">
<li data-url="news.html"><a href='#'>Artist sub</a>
</li>
<li data-url="news.html"><a href='#'>Artist sub</a>
</li>
</ul>
</li>
</ul>
</li>
<li data-url="gallery.html" class="has-sub menu_gallery"><a href='#'><span>Gallery</span></a>
<ul class="cssmenu2">
<li data-url="gallery.html"><a href='#'>Artist Name</a>
<ul class="cssmenu3">
<li data-url="news.html"><a href='#'>Artist sub</a>
</li>
<li data-url="news.html"><a href='#'>Artist sub</a>
</li>
</ul>
</li>
<li data-url="gallery.html" class="has-sub"><a href='#'>Artist Name</a>
<ul class="cssmenu3">
<li data-url="gallery.html"><a href='#'>Artist sub</a>
</li>
<li data-url="gallery.html"><a href='#'>Artist sub</a>
</li>
</ul>
</li>
<li data-url="news.html"><a href='#'>Artist Name</a>
<ul class="cssmenu3">
<li data-url="news.html"><a href='#'>Artist sub</a>
</li>
<li data-url="news.html"><a href='#'>Artist sub</a>
</li>
</ul>
</li>
</ul>
</li>
</ul>
</div>
</div>
</div>
</div>
数组没有.each
函数
optionTexts.each
你可以做
$.each(optionTexts,
function() { $("#hello").append(this); }
);
在数组
.each
函数我不确定我是否理解对了,但是这样你就会得到li
$(".cssmenu2 li").click(function(){
var text = $(this).children().html();
$("#hello").append(text);
});
小提琴
相关文章:
- 使用下拉列表筛选列表(ul>li)
- 修复列表的绝对位置(li's隐藏在前两个后面)
- 如何让li项目在这个jQuery列表中滑动和/或淡出视图
- 有角度的自动建议文本排版和html ul li下拉列表
- jQueryUI可排序-从可排序列表中删除li
- 转换UL->li inot为同位素过滤菜单选择的列表
- 对于列表中包含带文本的跨度的每个li,请从该li中删除另一个跨度
- 隐藏/显示li's列表以及if语句和document.write
- 如何以编程方式单击下拉列表中的li
- 根据不同长度的数据属性对无序列表中的 li 进行排序(无 jquery)
- 哪种模式在 gsub 中使用!将有序列表 (li 标记) HTML 字符串替换为订单号
- 如何查找列表项的索引 (ul-li)
- 我有一个数据列表,我将其转换为 Ul 和 li 的列表,现在我希望这个列表在 JSP 中显示为树
- 展开子菜单列表 OL,如果其列表 li 中的任何一个具有活动类
- 如何从 d3 节点层次结构创建 ul-li 列表
- ng-click似乎不适用于以编程方式插入的列表(li)元素
- 有没有更简单的方法可以在一个 UL 中获取 LI 列表编号
- 在 LI 内容上使用 wrapInside,但不对子列表使用
- 我如何瞄准或聚焦当输入被聚焦时激活的下拉列表li
- 量角器无法计数列表(li)中的链接