javascript代码不能执行！

问题描述：

我有一个index.html LIK ethis：javascript代码不能执行！

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>JavaScript Tooltip Demo</title> 
<link rel="stylesheet" type="text/css" href="style.css" /> 
</head> 
<body> 
<embed src="usmap.svg" width="3000" height="1000" 
type="image/svg+xml" 
pluginspage="http://www.adobe.com/svg/viewer/install/" /> 
<script type="text/javascript" language="javascript" src="script.js"></script> 
</body> 
</html>

的JavaScript文件本身是：

var tooltip=function(){ 
    var id = 'tt'; 
    var top = 3; 
    var left = 3; 
    var maxw = 300; 
    var speed = 10; 
    var timer = 20; 
    var endalpha = 95; 
    var alpha = 0; 
    var tt,t,c,b,h; 
    var ie = document.all ? true : false; 
    return{ 
     show:function(v,w){ 
      if(tt == null){ 
       tt = document.createElement('div'); 
       tt.setAttribute('id',id); 
       t = document.createElement('div'); 
       t.setAttribute('id',id + 'top'); 
       c = document.createElement('div'); 
       c.setAttribute('id',id + 'cont'); 
       b = document.createElement('div'); 
       b.setAttribute('id',id + 'bot'); 
       tt.appendChild(t); 
       tt.appendChild(c); 
       tt.appendChild(b); 
       document.body.appendChild(tt); 
       tt.style.opacity = 0; 
       tt.style.filter = 'alpha(opacity=0)'; 
       document.onmousemove = this.pos; 
      } 
      tt.style.display = 'block'; 
      c.innerHTML = v; 
      tt.style.width = w ? w + 'px' : 'auto'; 
      if(!w && ie){ 
       t.style.display = 'none'; 
       b.style.display = 'none'; 
       tt.style.width = tt.offsetWidth; 
       t.style.display = 'block'; 
       b.style.display = 'block'; 
      } 
      if(tt.offsetWidth > maxw){tt.style.width = maxw + 'px'} 
      h = parseInt(tt.offsetHeight) + top; 
      clearInterval(tt.timer); 
      tt.timer = setInterval(function(){tooltip.fade(1)},timer); 
     }, 
     pos:function(e){ 
      var u = ie ? event.clientY + document.documentElement.scrollTop : e.pageY; 
      var l = ie ? event.clientX + document.documentElement.scrollLeft : e.pageX; 
      tt.style.top = (u - h) + 'px'; 
      tt.style.left = (l + left) + 'px'; 
     }, 
     fade:function(d){ 
      var a = alpha; 
      if((a != endalpha && d == 1) || (a != 0 && d == -1)){ 
       var i = speed; 
       if(endalpha - a < speed && d == 1){ 
        i = endalpha - a; 
       }else if(alpha < speed && d == -1){ 
        i = a; 
       } 
       alpha = a + (i * d); 
       tt.style.opacity = alpha * .01; 
       tt.style.filter = 'alpha(opacity=' + alpha + ')'; 
      }else{ 
       clearInterval(tt.timer); 
       if(d == -1){tt.style.display = 'none'} 
      } 
     }, 
     hide:function(){ 
      clearInterval(tt.timer); 
      tt.timer = setInterval(function(){tooltip.fade(-1)},timer); 
     } 
    }; 
}();

当我把它叫做frmo的SVG：

onmouseover="tooltip.show('Testing 123 ');" onmouseout="tooltip.hide();"

是绝对做没有！

有谁知道为什么？

没有这工作得很好这里http://sixrevisions.com/tutorials/javascript_tutorial/create_lightweight_javascript_tooltip/ – 2010-08-24 22:09:40

后回到你的一条关于透明度 – 2010-08-24 22:10:57

答

<embed src="usmap.svg" ... 
<script type="text/javascript" language="javascript" src="script.js"></script>

您已将JavaScript包含在主HTML文档中，但您的SVG位于单独的嵌入式文档中。嵌入式文档无法访问所有者HTML文档;它不能从该文档中的脚本调用方法，并且即使将脚本包含在SVG文档中，也不会工作，因为仅编写此特定脚本（相当糟糕）才能与HTML文档进行交互。

嵌入式SVG是老式的。它主要用于通过Adobe SVG插件支持IE，但该插件不再受支持，并且没有人再使用它（几乎没有人使用过）。在用作application/xhtml+xml的XHTML + SVG文档中，include your SVG as part of the document itself更好。目前唯一不支持的桌面浏览器是IE6-8。然后你可以一起使用HTML和SVG内容。

（你也可以失去的古老language="javascript"）

答

您的XHTML无效，并且您嵌入SVG的非标准方法AFAIK作为单独文档（与父文档不共享相同的窗口对象）。

虽然脚本并不是为SVG编写的，但它具有IE特定的内容，而IE不支持SVG。

林不知道我理解。我在SVG里面有一个应该调用javascript函数的onmouseover事件。你的回答是错误的，因为我可以用这种方式调用其他函数，只是这个函数根本不响应 – 2010-08-24 22:13:10

javascript代码不能执行！

相关推荐