我有以下的场景:
var el = 'li';
并且在页面上有5个<li>
,每个具有data-slide=number
属性 (数字分别为1、2、3、4、5)。
现在我需要找到当前活动的幻灯片编号,该编号Map到var current = $('ul').data(current);
,并在每次更改幻灯片时更新。
到目前为止,我的尝试都没有成功,我试图构造与当前幻灯片匹配的选择器:
$('ul').find(el+[data-slide=+current+]);
不匹配/返回任何内容...
我不能硬编码li
部分的原因是,这是一个用户可访问的变量,如果需要,可以将其更改为不同的元素,因此它不一定总是li
。
你知道我错过了什么吗?
9条答案
按热度按时间j8ag8udp1#
您必须将
current
的值注入Attribute Equals选择器:对于较旧的JavaScript环境(ES5及更早版本):
u0sqgete2#
如果您不想键入所有这些内容,下面是一种按数据属性查询更快捷方法:
仅供参考:http://james.padolsey.com/javascript/a-better-data-selector-for-jquery/
km0tfn4u3#
使用[data-x=...]进行搜索时,请注意,它不适用于jQuery.data(..)setter:
您可以改用以下命令:
iszxjhcz4#
没有JQuery,ES6
dxxyhpgq5#
我将psycho brm's filterByData extension改进为jQuery。
前一个扩展搜索键-值对,而使用这个扩展,您还可以搜索数据属性的存在,而不管它的值是什么。
用法:
一个一个二个一个一个一个三个一个一个一个一个一个四个一个
或是小提琴:http://jsfiddle.net/PTqmE/46/
rlcwz9us6#
我在使用jQuery和data-* 属性获取元素时遇到过同样的问题。
因此,最短的代码如下所示,供您参考:
这是我的HTML代码:
这是我的jQuery选择器:
ds97pgxw7#
此选择器
$("ul [data-slide='" + current +"']");
将用于以下结构:而此
$("ul[data-slide='" + current +"']");
适用于:<ul data-slide="item"><li></li></ul>
kadbb4598#
我希望这样可以更好地工作
谢谢
blpfk2vs9#
回到他最初的问题,关于如何在不事先知道元素类型的情况下完成这个工作,下面的代码可以做到这一点: