jQuery在悬停时将类添加到不同的div中，如果它包含特定的文本(x100)
由于某些原因，我无法理解如何告诉jQuery在一堆中查看每个div，然后根据该div的内容做出决定。
我有这样的HTML：
<div id="maintable">
<div class="elbox">
content
<div class="options">A,B,C</div>
</div>
<div class="elbox">
content
<div class="options">B,F</div>
</div>
<!-- and about a hundred more just like these -->)
</div>
<div id="menutable">
<div class="optionA">A</div>
<div class="optionB">B</div>
<div class="optionC">C</div>
</div>我想做一个悬停函数，这样做：
悬停在#menutable (.elbox)
- Remove
- 脚本上的
- 扫描所有#可维护的.options div的文本字符串"A“”
- “如果在div.options中找到"A”，如果在div.options中没有找到“A”，脚本会在鼠标退出
H 112上向父div .optionA新类添加一些CSS，查找“B”和.optionC (查找“C”)H 213G 214执行类似操作。
到目前为止，我有这样的想法：
$('.menutable').hover(function() {
$('.options').each(function(i) {
if (!$(".options:contains('A')")) {
$('.elbox').addClass('bgtransp');
}
});
});但不起作用。
但是，如果我翻转逻辑，以便在找到"A“时发生addClass，则该类将应用于每个.elbox。因此，我认为我的脚本可能实际上是在说，“如果任何.options div有一个"A”，那么隐藏每个.elbox。
我做错了什么？是我的“每个人”吗？我是不是错过了父母的选择器？...Or完全是错误的方法吗？
为我的虚荣心表示歉意(我正在努力)，谢谢！
回答 3
Stack Overflow用户
发布于 2011-08-08 23:47:05
$('#menutable div').hover(function() {
var current = $(this);
$('#maintable .options').each(function() {
if (!$(this).is(":contains('" + current.text() + "')")) {
$(this).closest('.elbox').addClass('bgtransp');
}
});
});而且你的选择器使用的是。当它应该是#
Stack Overflow用户
发布于 2011-08-08 23:44:12
这应该能起作用：
$('#menutable div').hover(function() {
var that = this;
$('#maintable .options').filter(function() {
return $(this).text().indexOf($(that).text()) === -1;
}).closest(".elbox").css("border", "1px solid red");
});http://jsfiddle.net/zfPZS/1/
Stack Overflow用户
发布于 2011-08-08 23:58:05
见这里http://jsfiddle.net/Kp39C/8/
我认为，当菜单悬停时，您可能不想搜索A，而是从选项中搜索，其中包含当前单元格中的值。因此，您必须在一个更原子的元素中应用悬浮事件处理程序。
你还在说‘。’‘选择器而不是"#“选择器，查看此页面以获得有关该事项的更多信息：http://www.w3.org/TR/css3-selectors/
使用正确的选择器，使用find()和has() jquery函数可以使您的生活方式更容易:)
$('#menutable')
.find('div')
.hover(
function() {
var overMe=$(this);
$(".options:contains('"+overMe.html()+"')").each(
function() {
$(this).addClass('bgtransp');
}
);
}
);https://stackoverflow.com/questions/6989843
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号