jquery自定义函数调用不起作用
jquery自定义函数调用不起作用
提问于 2018-08-08 05:42:55
我是jquery、ajax和jstree的新手。我使用jstree让我的<ul>元素看起来像一个树结构。我将容器放在id =“<ul>”的div标记下。当我执行html文件时，div (id = "container")被传递给jstree函数，如下所示：
$(function() {
$('#container').jstree();
});我的html代码片段如下：
<div id="container">
<ul id = "treeNodes">
<li>Parent
<ul>
<li>Child1
<ul>
<li>child2-1</li>
<li>child2-2</li>
<li>child2-3</li>
<li>child2-4</li>
</ul>
</li>
</ul>
</li>
</ul>
</div>树结构显示正常。
我正在尝试编写一个jquery函数，它将li元素的名称作为参数。例如:当我点击Parent时，函数应该接收"Parent“作为参数，或者当我点击child2 2-3时，函数应该接收”child2 2-3“作为参数。
我试图创建该函数，但它似乎不起作用。这是我的尝试-
$("#treeNodes li").click(function() {
console.log("hello");
console.log(this.innerHTML);
});控件似乎转到调用jstree()的函数，但另一个函数似乎不起作用。任何帮助或提示都将不胜感激。提前谢谢。
回答 2
Stack Overflow用户
回答已采纳
发布于 2018-08-08 05:55:54
将结构转换为JSTree会创建新的超文本标记语言，并且这些新元素具有自定义类和新API。因此，您必须阅读文档以了解如何使用新结构。
如果您查看，您将看到一个依赖于自定义changed事件的示例。我已经重现了这个示例，为您的HTML和console输出定制了它。
$(function() {
$('#container')
// listen for the custom "changed" event on any jstree
.on('changed.jstree', function (e, data) {
// When you click on a JSTree the event appears to fire on the entire tree
// You'll have to iterate the tree nodes for the selected one.
var i, j, r = [];
for(i = 0, j = data.selected.length; i < j; i++) {
r.push(data.instance.get_node(data.selected[i]).text);
}
console.clear();
console.log('Selected: ' + r.join(', '));
})
// create the instance
.jstree();
});<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/themes/default/style.min.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.3.5/jstree.min.js"></script>
<div id="container">
<ul id = "treeNodes">
<li>Parent
<ul>
<li>Child1
<ul>
<li>child2-1</li>
<li>child2-2</li>
<li>child2-3</li>
<li>child2-4</li>
</ul>
</li>
</ul>
</li>
</ul>
</div>
Stack Overflow用户
发布于 2018-08-08 06:19:20
我已经阅读了jstree页面上的文档：https://www.jstree.com/
jstree中有一个名为jstree- called的类，您可以从该类中获取列表中的值，如下所示：
$(document).on('click', '.jstree-children ul li', function (e) {
console.log($(this).html());
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51735843
复制相关文章
相似问题