javascript - dat.GUI 单击时调整大小

Question

我有一个用户脚本，用于添加预定义搜索的自定义列表。为此，我使用 dat.gui 创建了一个 GUI并迭代对象的键来创建按钮列表。键的值用作搜​​索查询。

我的 JavaScript:

NodeList.prototype.forEach = Array.prototype.forEach;

var shows = {
        'Agents of S.H.I.E.L.D.' : 'marvels agents of s.h.i.e.l.d.',
        'Arrow' : 'arrow s',
        'Brooklyn Nine-Nine' : 'brooklyn nine-nine',
        'Castle' : 'castle 2009',
        'Chicago Fire' : 'chicago fire',
        'Chicago P.D.' : 'chicago p.d.',
        'Constantine' : 'contanstine s',
        'Doctor Who' : 'doctor who',
        'Gotham' : 'gotham s',
        'Grimm' : 'grimm s',
        'Madam Secretary' : 'madam secretary',
        'NCIS LA' : 'ncis los angeles',
        'Resurrection' : 'resurrection',
        'Saturday Night Live' : 'saturday night live',
        'Scandal' : 'scandal s',
        'Scorpion' : 'scorpion s',
        'Stalker' : 'stalker s',
        'The 100' : 'the 100 s',
        'The Big Bang Theory' : 'the big bang theory',
        'The Blacklist' : 'the blacklist',
        'The Flash' : 'the flash',
        'The Tonight Show Starring Jimmy Fallon' : 'jimmy fallon',
        'Z Nation' : 'z nation'
    },
    show = function() {
        for (var k in shows) {
            this[k] = function() {
                document.getElementById('tsstac').value = shows[k].replace(/ /g, '.');
                document.querySelectorAll('[type=submit]')[0].click();
            };
        }
    };
window.onload = function() {
    var text = new show(),
        gui = new dat.GUI();
    for (var k in shows) {
        gui.add(text, k);
    }
    document.querySelectorAll('li.cr>div>span.property-name').forEach(function(v) {
        v.style.width = '100%';
    });
};

基本上，每当我单击“关闭控件”按钮时，它就会决定永远跟随我的鼠标调整大小，直到刷新。即使我尝试重新打开 GUI，它仍然跟随鼠标。我想它会对按钮做同样的事情，尽管它们在点击时会进入一个新页面，因此它会重置 GUI。

我该如何解决这个问题？另外，是否有 dat.GUI 的 API 或任何文档？

Answer 1

通过更改以下内容修复了此问题:

gui = new dat.GUI({
    resizable : false
});