有没有人找到将工具提示添加到 dat.gui 条目的方法？
似乎没有class分配给它们，我该如何选择它们？
最佳答案
您需要自己将此功能添加到 dat.GUI。以下是一些指南和示例解决方案。
条目用继承自 Controller 的类表示类(class)。每个 Controller 都有一个私有(private)成员 __li , 代表它的 <li> gui 中的元素。您可以扩展 Controller原型(prototype)并添加 title函数，将添加、更新或删除 __li的标题属性。
这是片段:
/* dat.GUI copies the prototype of superclass Controller to all other controllers, so it is not enough to add it only to
the super class as the reference is not maintained */
var eachController = function(fnc) {
for (var controllerName in dat.controllers) {
if (dat.controllers.hasOwnProperty(controllerName)) {
fnc(dat.controllers[controllerName]);
}
}
}
var setTitle = function(v) {
// __li is the root dom element of each controller
if (v) {
this.__li.setAttribute('title', v);
} else {
this.__li.removeAttribute('title')
}
return this;
};
eachController(function(controller) {
if (!controller.prototype.hasOwnProperty('title')) {
controller.prototype.title = setTitle;
}
});
// demo
var Dummy = function() {
this.foo = 12
};
Dummy.prototype.bar = function() {
console.log('1');
};
var gui = new dat.GUI();
var d = new Dummy();
gui.add(d, 'foo').name('Foo').title('Foo\'s title');
gui.add(d, 'bar', 1, 13, 1).name('Bar').title('Bar\'s title');<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
</head>
<body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/dat-gui/0.5/dat.gui.min.js"></script>
</body>
</html>关于javascript - 如何向 dat.gui 添加工具提示，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/27362914/