计算机科学论坛--显示贴子

以文本方式查看主题

-  计算机科学论坛  (http://bbs.xml.org.cn/index.asp)
--  『 SVG/GML/VRML/X3D/XAML 』  (http://bbs.xml.org.cn/list.asp?boardid=21)
----  关于鼠标事件的响应  (http://bbs.xml.org.cn/dispbbs.asp?boardid=21&rootid=&id=36073)

--  作者：newone
--  发布时间：7/26/2006 11:40:00 AM

--  关于鼠标事件的响应
为了实现在SVG显示区域任意点击都有响应。一共3个文件：
JS脚本test.js：
function Init(evt)
{
    var SVGDoc=evt.target.ownerDocument;
    var MainSVG=SVGDoc.getElementById("main");

    MainSVG.addEventListener("mousedown",svgMouseDown,false);
}
function svgMouseDown(evt)
{
alert("MouseDown");
}

SVG文件test.svg：
<?xml version="1.0" encoding="utf-8"?>
<svg onload="Init(evt)" >
<script xlink:href="test.js" language="JavaScript"/>
<svg id="main" width="470px" height="460px" viewBox="0 0 240 220" ></svg>
</svg>

HTML文件：
<html>
<body>
<embed width="480" height="460" type="image/svg-xml" pluginspage="http://www.adobe.com/svg/viewer/install/" src="test.svg" ></embed>

</body>
</html>

这些文件的内容都很简单。不能够实现我的需求，点击SVG文件完全没有任何反应，不知为什么，谢谢！

--  作者：vagerent
--  发布时间：7/26/2006 1:44:00 PM

--
关注，学习。

[此贴子已经被作者于2006-7-26 14:14:05编辑过]

--  作者：raisuny
--  发布时间：7/26/2006 2:17:00 PM

--
把var MainSVG=SVGDoc.getElementById("main");
换成var MainSVG=SVGDoc.getElementById("svg);

--  作者：newone
--  发布时间：7/26/2006 2:21:00 PM

--
哪有ID是SVG的元素？SVG本身就是元素。实践证明也是错的。

--  作者：tamefox
--  发布时间：7/26/2006 7:41:00 PM

--
你在SVG中加入一个元素，点击这个元素，就会激发你所动态定义的事件。因为SVG元素本身只能激发onload, onunload, onabort, onerror, onresize,onscroll和onzoom事件。
<svg id="main" width="470px" height="460px" viewBox="0 0 240 220">
      <rect width="100" height="15"/>
</svg>

--  作者：newone
--  发布时间：7/26/2006 9:12:00 PM

--
“SVG元素本身只能激发onload, onunload, onabort, onerror, onresize,onscroll和onzoom事件。“这个依据在什么地方呢？因为我见过我所写代码的应用。

--  作者：tamefox
--  发布时间：7/26/2006 9:21:00 PM

--
<基于XML的SVG应用指南>这本书的第179页或者参考svg规范

--  作者：newone
--  发布时间：7/26/2006 9:28:00 PM

--
恩，找到了，谢谢！
ENTITY % SVG.DocumentEvents.attrib
"%SVG.onunload.attrib;
%SVG.onabort.attrib;
%SVG.onerror.attrib;
%SVG.onresize.attrib;
%SVG.onscroll.attrib;
%SVG.onzoom.attrib;

--  作者：newone
--  发布时间：7/26/2006 9:42:00 PM

--
可是奇怪的是，把事件名称改成SVGLoad的时候还是不行

--  作者：welfred
--  发布时间：7/27/2006 10:45:00 AM

--
在保持你文档结构不变的条件下，JS脚本可以改成：
function Init(evt)
{
    var SVGDoc=evt.target.ownerDocument;
    var MainSVG=SVGDoc.getElementById("main");

    MainSVG.addEventListener("mousedown",svgMouseDown,false);

   var ele="<rect width='240' height='220' fill-opacity='0'/>";
   MainSVG.insertBefore(parseXML(ele,SVGDoc),null);
}
function svgMouseDown(evt)
{
     alert("MouseDown");
}
经测试，可以使用。

--  作者：welfred
--  发布时间：7/27/2006 12:31:00 PM

--
可是奇怪的是，这个事件到底算谁的？

--  作者：newone
--  发布时间：7/27/2006 12:44:00 PM

--
奇怪的事情又发生了，我改成面向对象的JS脚本，却又不行了。
function Init(evt)
{
var obj = new testObject(evt);

}
function testObject(evt)
{
    this.SVGDoc=evt.target.ownerDocument;
    this.MainSVG=this.SVGDoc.getElementById("main");

    this.MainSVG.addEventListener("mousedown",this,false);

var ele="<rect width='240' height='220' fill-opacity='0'/>";
this.MainSVG.insertBefore(parseXML(ele,this.SVGDoc),null);
}

testObject.prototype.mousedown=function(evt)
{
alert("MouseDown");
}

W 3 C h i n a ( since 2003 ) 旗下站点
苏ICP备05006046号《全国人大常委会关于维护互联网安全的决定》《计算机信息网络国际联网安全保护管理办法》

78.125ms