作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我有一个具有以下结构的 TreeView ,我想扩展树节点以按 id 选择特定节点。
我已经达到了可以到达parentUntil的阶段,但我不确定如何使用它触发点击事件或更改 parent 的 sibling 的 child 的类,
这是 fiddle :www.jsfiddle.net/m3hecxyr
这就是我正在尝试的,
$("a[href='#id=4'").parentsUntil($("#list > ul")) // what's next ?
结构
<div id="list">
<ul>
<li>
<div>
<div class="col" onclick="toggle(this);" />
<div class="icon" />
<a href="#id=1">A</a>
</div>
<ul>
<li>
<div>
<div class="col" onclick="toggle(this);" />
<div class="icon" />
<a href="#id=2">A.1</a>
</div>
<ul>
<li>
<div>
<div class="icon" />
<a href="#id=3">A.1.1</a>
</div>
</li>
<li>
<div>
<div class="icon" />
<a href="#id=4">A.1.2</a>
</div>
</li>
</ul>
</li>
<li>
<div>
<div class="icon" />
<a href="#id=5">B</a>
</div>
</ul>
</li>
<li>
<div>
<div class="icon" />
<a href="#id=6">C</a>
</div>
</li>
</ul>
</div>
最佳答案
How can I trigger click event on divs with class "col" using or without using parentsUtil function
如果您打算点击与当前子树相关的具有 col 类的 div 元素,您需要转到最近的具有此类类的 div 的元素,并从那里找到相应的 div:
$("a[href='#id=4']").closest($("ul:has(div.col)")).find ('div.col').get(0).click();
未描述您的切换功能,因此我建议将其实现为:
function toggle(ele, evt) {
evt.stopPropagation();
ele.classList.toggle('col');
ele.classList.toggle('exp');
}
对于内联调用:
toggle(this, event);
片段:
function toggle(ele, evt) {
evt = evt || window.event;
evt.stopPropagation();
ele.classList.toggle('col');
ele.classList.toggle('exp');
}
$(function () {
$("a[href='#id=4']")
.closest($("ul:has(div.col)"))
.find ('div.col').get(0).click();
});
.col {
border: 3px solid green;
}
.exp {
border: 3px solid red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="list">
<ul>
<li>
<div>
<div class="col" onclick="toggle(this, event);" />
<div class="icon" />
<a href="#id=1">A</a>
</div>
<ul>
<li>
<div>
<div class="col" onclick="toggle(this, event);" />
<div class="icon" />
<a href="#id=2">A.1</a>
</div>
<ul>
<li>
<div>
<div class="icon" />
<a href="#id=3">A.1.1</a>
</div>
</li>
<li>
<div>
<div class="icon" />
<a href="#id=4">A.1.2</a>
</div>
</li>
</ul>
</li>
<li>
<div>
<div class="icon" />
<a href="#id=5">B</a>
</div>
</ul>
</li>
<li>
<div>
<div class="icon" />
<a href="#id=6">C</a>
</div>
</li>
</ul>
</div>
关于javascript - 使用parentsUntil或不使用parentUntil在 TreeView 中触发单击事件来搜索节点,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42651292/
我有: Select all/none Option 1 Option 2 Option 3 $("#a").parentsUntil("table").find(":ch
我是一名优秀的程序员,十分优秀!