代码之家 › 专栏 › 技术社区 › Rich Apodaca

在VML和Internet Explorer中禁用图形元素选择

vml google-closure internet-explorer javascript

0

Rich Apodaca · 技术社区 · 14 年前

我有一个JavaScript应用程序,允许用户在绘图区域周围移动形状,而我恰好使用了Google关闭库。在FF/Safari中,一切都很好。在IE中,当图形元素移动时,浏览器会选择它们(移动元素和其他元素),以不可预测的方式在某些元素周围显示彩色虚线背景:

http://i.imgur.com/O33MN.png

我怎样才能在IE中关闭这种行为?

2 回复 | 直到 14 年前

1

2

mwilcox 14 年前

根据提供的信息很难诊断出你的问题。IE VML的支持不是很好,因此非常有缺陷。

在Dojox绘图中,我在绘制线条时遇到了类似的问题。vml有一个bug,你不能同时拖动和调整大小,但是你可以同时拖动和创建,所以我重新绘制线条,我不转换它。

此外,我不会将单击/拖动事件附加到形状上,我会将它们附加到整个主容器上,检测mousedown事件上的ID,然后跟踪mousemove并通过对形状容器执行设置转换来移动形状。

本质上,由于对VML的支持很弱,您必须愿意尝试完全不同的东西才能使其工作。

2

0

Rich Apodaca 14 年前

经过一些试验,我找到了部分答案。

这个 goog.events.Event 类具有PreventDefault方法。只需处理图形元素上的mousemove事件。然后调用Event PreventDefault方法:

var element = ... // some element
var graphics = goog.graphics.createGraphics('400', '300');

var fill = new goog.graphics.SolidFill('#00ff00', 0.5);
var stroke = new goog.graphics.Stroke(1, 'black');

graphics.drawEllipse(60, 60, 10, 10, stroke, fill);
graphics.drawEllipse(90, 90, 10, 10, stroke, fill);

graphics.render(element);

goog.events.listen(graphics.getElement(), goog.events.EventType.MOUSEMOVE, function(e) {
  e.preventDefault();
  e.stopPropagation();
});

单击图形元素内部,然后拖动将不再选择圆。同样,这只在IE上是必要的。

还有一个小问题。在图形区域外按鼠标,然后将光标拖动到图形区域中,将导致选择整个区域,或同时选择区域和图形元素。