Question

我正在使用splitter from jQWidegts，并且在启用拆分器时遇到一些奇怪的行为。当它被禁用时，奇怪的行为就会停止。我创建了一个JSFiddle of the problem - 它就像我能得到它一样简单。

要重新创建问题：

加载JSFiddle，在执行任何操作之前，将鼠标悬停在提交上按钮或“字符串”选项卡。
提交按钮应更改为红色color和“字符串” 标签也改变了风格。
接下来，点击一些空格，例如，在提交下方按钮或'字符串'选项卡。
现在鼠标悬停在按钮或标签上 - 样式不再更改无论是。
如果再次在某个空格中单击，则鼠标悬停，即样式确实有所改变。

这是不类似切换的行为，因为单击第三次不会阻止鼠标悬停时的样式。它只在第一次出现。

如果我注释掉设置拆分器的行：

$('#splitter').jqxSplitter(splitterConf);

我唯一的想法是分裂器正在消耗一个事件而不会传播。但是splitter div没有附加任何事件，至少它们没有显示在Chrome的JavaScript调试器中。

我注意到当点击空白区域（触发问题）时，额外的splitter元素将附加到DOM：

div

以下代码中<div style="width: 1680px; height: 275px; position: absolute; left: 0px; top: 0px; "></div>附加了此元素：

jqxsplitter.js

从callstack我看到它是从_stopDrag调用的，所以它似乎是防止拖动的一种方法：

initOverlay: function(c) {
            var b = this;
            if (b.overlay && c == undefined) {
                b.overlay.remove()
            } else {
                b.overlay = a("<div></div>");
                b.overlay.width(b.host.width());
                b.overlay.height(b.host.height());
                b.overlay.css("position", "absolute");
                b.overlay.appendTo(a(document.body));
                var d = b.host.offset();
                b.overlay.css("left", d.left);
                b.overlay.css("top", d.top)
            }

但我不知道为什么会发生这种情况或者为什么会引起问题。理想情况下，有人知道问题是什么，但如果失败了，关于如何调试/转向解决方案的一些提示会很好。

Answer 1

来自jQWidgets小组

这是一个已知问题，将在下一版本中解决。

Src：http://www.jqwidgets.com/community/topic/splitter-widget-causing-loss-focus-or-event-consumption

jQWidgets Splitter Widget导致丢失焦点或事件消耗

1 个答案: