→请问如何让这段代码正常运行呢？

<html>
<head>
<title>
震动效果
</title>
<script language="javascript" type="text/javascript">
function kk(){
    this.o = null;
    this.bb = 1;
    this.OutputLayer = OutputLayer;
    this.move = move;
    this.stop = stop;
    function OutputLayer(width, height, LayerID){
        document.write("<div id='"+LayerID+"' onmouseover="+this.move()+" onmouseout="+this.stop()+" style='background-color:#f8f8f5;cursor:hand;border:solid 1px #cccccc;height:"+height+";width:"+width+";position:absolute'></div>");
    }
    function move(){
//        with(document.getElementById(LayerID)){
//           if (this.bb == 1){
//            style.left = offsetLeft + 5;
//            style.top = offsetTop + 5;
//            this.bb = 0;
//        }else{
//            style.left = offsetLeft - 5;
//            style.top = offsetTop - 5;
//            this.bb = 1;
//        }
//        this.o = setTimeout(this.move(),1000);
    }
    function stop(){
        clearTimeout(this.o);
    }
}
var aa = new kk();
aa.OutputLayer(100, 300, "kk");
</script>
</head>
<body>
</body>
</html>
这样就会正常

解决方案 »

  1.   

    with(document.getElementById(LayerID)){
    这个得不到值，我也在看，郁闷呢。
      

  2.   

    <html>
    <head>
    <title>
    震动效果
    </title>
    <script language="javascript" type="text/javascript">
    LayerID="kk"
    var o, bb = 1;
        function OutputLayer(width, height, LayerID){
            document.write("<div id='"+LayerID+"' onmouseover=move() onmouseout=stopTime() style='background-color:#f8f8f5;cursor:hand;border:solid 1px #cccccc;height:"+height+";width:"+width+";position:absolute'>asdas</div>");
        }
        function move(){
            with(document.getElementById(LayerID)){
               if (bb == 1){
                style.left = offsetLeft + 5;
                style.top = offsetTop + 5;
                bb = 0;
            }else{
                style.left = offsetLeft - 5;
                style.top = offsetTop - 5;
                bb = 1;
            }
            o = setTimeout("move()",100);
        }
        function stopTime(){
            clearTimeout(o);
        }
    }
    OutputLayer("100","100","kk");
    </script>
    </head>
    <body>
    </body>
    </html>
      

  3.   

    我也改了一下，不过有点错误：<head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>无标题文档</title>
    </head>
    <script language="JavaScript" type="text/javascript">
    var o;
    var flag = 1;
    function OutputLayer(width, height, layerId){
    this.layer = document.createElement("div");
    this.layer.id = layerId;
    //this.layer.style.cursor = "hand";
    this.layer.style.backgroundColor = "#f8f8f5";
    this.layer.style.border = "solid 1px #cccccc";
    this.layer.style.position = "absolute";
    this.layer.style.width = width + "px";
    this.layer.style.height = height + "px";

    this.layer.onmouseover = move;
    this.layer.onmouseout = stop1;
    }function move(){
    with(this){
    if (flag == 1){
    style.left = offsetLeft + 5;
    style.top = offsetTop + 5;
    flag = 0;
    }else{
    style.left = offsetLeft - 5;
    style.top = offsetTop - 5;
    flag = 1;
    }
    o = setTimeout("move()",1000);
    }
    }function stop1(){
    clearTimeout(o);
    }
    window.onload = function() {
    document.getElementById ("xxx").appendChild(new OutputLayer(100, 100, "testLayer").layer);
    }
    </script>
    <body>
    <div id="xxx"></div>
    </body>
    </html>
      

  4.   

    <html>
    <head>
    <title>
    震动效果
    </title>
    <script language="javascript" type="text/javascript">
    LayerID="kk"
    var o, bb = 1;
        function OutputLayer(width, height, LayerID){
        str = "<div id='"+LayerID+"' onmouseover=move() onmouseout =stopTime() style='background-color:#f8f8f5;cursor:hand;border:solid 1px #cccccc;height:"+height+";width:"+width+";position:absolute'>asdas</div>";
            document.write(str);
        }
        function move(){
            with(document.getElementById(LayerID)){
               if (bb == 1){
                style.left = offsetLeft + 5;
                style.top = offsetTop + 5;
                bb = 0;
            }else{
                style.left = offsetLeft - 5;
                style.top = offsetTop - 5;
                bb = 1;
            }
            o = setTimeout("move()",500);
        }
        
       }    function stopTime(){
       clearTimeout(o);
        }
    OutputLayer("100","100","kk");
    </script>
    </head>
    <body>
    </body>
    </html>
      

  5.   

    既然得不到，我看在KimSoft兄弟代码的基础上可以设个全局变量
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>无标题文档</title>
    </head>
    <script language="JavaScript" type="text/javascript">
    var o;
    var flag = 1;
    Objid="";
    function OutputLayer(width, height, layerId){
    this.layer = document.createElement("div");
    this.layer.id = layerId;
    //this.layer.style.cursor = "hand";
    this.layer.style.backgroundColor = "#f8f8f5";
    this.layer.style.border = "solid 1px #cccccc";
    this.layer.style.position = "absolute";
    this.layer.style.width = width + "px";
    this.layer.style.height = height + "px";

    this.layer.onmouseover = move;
    this.layer.onmouseout = stop1;
    }function move(){
    with(document.getElementById(Objid)){
    if (flag == 1){
    style.left = offsetLeft + 5;
    style.top = offsetTop + 5;
    flag = 0;
    }else{
    style.left = offsetLeft - 5;
    style.top = offsetTop - 5;
    flag = 1;
    }
    o = setTimeout("move()",100);
    }
    }function stop1(){
    clearTimeout(o);
    }
    window.onload = function() {
    var obj=new OutputLayer(100, 100, "testLayer").layer;
    Objid=obj.id;
    document.getElementById ("xxx").appendChild(obj);
    }
    </script>
    <body>
    <div id="xxx"></div>
    </body>
    </html>
      

  6.   

    楼上的强人，把变量全部移到function里面呢，可试过写了...BT啊...
      

  7.   

    可以把生成的对象写成全局的
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>无标题文档</title>
    </head>
    <script language="JavaScript" type="text/javascript">
    var o;
    var flag = 1;
    function OutputLayer(width, height, layerId){
    this.layer = document.createElement("div");
    this.layer.id = layerId;
    this.layer.style.cursor = "hand";
    this.layer.style.backgroundColor = "#f8f8f5";
    this.layer.style.border = "solid 1px #cccccc";
    this.layer.style.position = "absolute";
    this.layer.style.width = width + "px";
    this.layer.style.height = height + "px";

    this.layer.onmouseover = move;
    this.layer.onmouseout = stop1;
    }function move(){
    with(obj){
    if (flag == 1){
    style.left = offsetLeft + 5;
    style.top = offsetTop + 5;
    flag = 0;
    }else{
    style.left = offsetLeft - 5;
    style.top = offsetTop - 5;
    flag = 1;
    }
    o = setTimeout("move()",100);
    }
    }function stop1(){
    clearTimeout(o);
    }
    window.onload = function() {
    obj=new OutputLayer(100, 100, "testLayer").layer;
    document.getElementById ("xxx").appendChild(obj);
    }
    </script>
    <body>
    <div id="xxx"></div>
    </body>
    </html>感觉还是不太好，我想应该可以通过.caller属性判断这个函数是第一次被调用（因为是主调，后面的都不是主调），还是以后被调用的，这样在第一次就可以用this,后面还没想好用什么，呵呵
      

  8.   

    YE~~~
    可以把setTimeout函数重载一次，这样就好了
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>无标题文档</title>
    </head>
    <script language="JavaScript" type="text/javascript">
    var _st = window.setTimeout;
    window.setTimeout = function(fRef,mDelay)
    {
    if(typeof fRef =="function")
    {
    var argu=Array.prototype.slice.call(arguments,2);
    var f=(
    function(){
    fRef.apply(null, argu);
    }
    );
    return _st(f,mDelay);
    }
    return _st(fRef,mDelay);
    }
    var o;
    var flag = 1;
    function OutputLayer(width, height, layerId){
    this.layer = document.createElement("div");
    this.layer.id = layerId;
    this.layer.style.cursor = "hand";
    this.layer.style.backgroundColor = "#f8f8f5";
    this.layer.style.border = "solid 1px #cccccc";
    this.layer.style.position = "absolute";
    this.layer.style.width = width + "px";
    this.layer.style.height = height + "px";

    this.layer.onmouseover = move;
    this.layer.onmouseout = stop1;
    }function move(obj){
    if(move.caller!=null)
    {
    with(obj){
    if (flag == 1){
    style.left = offsetLeft + 5;
    style.top = offsetTop + 5;
    flag = 0;
    }else{
    style.left = offsetLeft - 5;
    style.top = offsetTop - 5;
    flag = 1;
    }
    o = setTimeout(move,100,obj);
    }
    }
    else
    {
    with(this){
    if (flag == 1){
    style.left = offsetLeft + 5;
    style.top = offsetTop + 5;
    flag = 0;
    }else{
    style.left = offsetLeft - 5;
    style.top = offsetTop - 5;
    flag = 1;
    }
    o = setTimeout(move,100,this);
    }

    }
    }function stop1(){
    clearTimeout(o);
    }
    window.onload = function() {
    var obj=new OutputLayer(100, 100, "testLayer").layer;
    document.getElementById ("xxx").appendChild(obj);
    }
    </script>
    <body>
    <div id="xxx"></div>
    </body>
    </html>
      

  9.   

    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>无标题文档</title>
    </head>
    <script language="JavaScript" type="text/javascript">
    //仅支持FireFox,要支持IE，只得覆写 window.setTimeout 方法
    function OutputLayer(id, width, height, offset){
    this.layer = document.createElement("div");

    this.layer.id = id;
    this.layer.offset = offset;

    this.layer.timerId = null;
    this.layer.flag = 1;

    //this.layer.style.cursor = "hand";  //FireFox不支持
    this.layer.style.backgroundColor = "#f8f8f5";
    this.layer.style.border = "solid 1px #cccccc";
    this.layer.style.position = "absolute";
    this.layer.style.width = width + "px";
    this.layer.style.height = height + "px";

    this.layer.onmouseover = this.over;
    this.layer.onmouseout = this.out;
    } OutputLayer.prototype.over = function(){
    //注意：此时 this 引用的是上面的 this.layer
    mouserOver(this);
    }OutputLayer.prototype.out = function(){
    clearTimeout(this.timerId);
    }function mouserOver(e){
    with(e){
    if (e.flag == 1){
    style.left = offsetLeft + e.offset;
    style.top = offsetTop + e.offset;
    e.flag = 0;
    }else{
    style.left = offsetLeft - e.offset;
    style.top = offsetTop - e.offset;
    e.flag = 1;
    }
    }
    e.timerId = setTimeout(mouserOver, 100, e);
    }window.onload = function() {
    document.getElementById ("xxx").appendChild(new OutputLayer("testLayer", 100, 100, 3).layer);
    }
    </script>
    <body>
    <div id="xxx"></div>
    </body>
    </html>
      

  10.   

    FireFox下window.setTimeout支持如下用法:setTimeout(expression, msec)
    setTimeout(function, msec, arg1, ..., argN) IE就不行。这几天看书，发现netscape对标准的支持比IE好很多，IE总是特列独行。
    特别是2级DOM标准和CSS2的支持。当然IE也有不少“体贴”设计者的地方，不过还是想引用一位大虾的一句评语："poor ie!"
      

  11.   

    呵呵，果然是fason写的，我找到重载settimeout的那个历史帖子了
    fason和emu确实强，我赚到了，地址在
    http://topic.csdn.net/t/20040720/12/3191873.html
      

  12.   

    唉呀，终于比较通用啦，加上了详细的注释，自己也学了不少东东。<head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>无标题文档</title>
    </head>
    <script language="JavaScript" type="text/javascript">
    //如果不是Netscape浏览器，覆写 window.setTimeout 方法
    if (navigator.appName.indexOf("Netscape") == -1){
    var _st = window.setTimeout;
    window.setTimeout = function(fRef,mDelay){
    if(typeof fRef =="function"){
    var argu=Array.prototype.slice.call(arguments,2);
    var f=(function(){fRef.apply(null, argu);});
    return _st(f,mDelay);
    }
    return _st(fRef,mDelay);
    }
    }function OutputLayer(id, width, height, offset){
    this.layer = document.createElement("div");

    this.layer.id = id;
    this.layer.offset = offset;

    this.layer.timerId = null;
    this.layer.flag = 1; //this.layer.style.cursor = "hand";  //FireFox不支持
    this.layer.style.backgroundColor = "#f8f8f5";
    this.layer.style.border = "solid 1px #cccccc";
    this.layer.style.position = "absolute";
    this.layer.style.width = width + "px";
    this.layer.style.height = height + "px";

    //用这种方式给对角加上事件比较通用
    this.layer.onmouseover = this.over;
    this.layer.onmouseout = this.out;
    } OutputLayer.prototype.over = function(){
    //注意：此时 this 引用的是上面的 this.layer
    mouserOver(this);
    }OutputLayer.prototype.out = function(){
    //注意：此时 this 引用的是上面的 this.layer
    clearTimeout(this.timerId);
    }function mouserOver(e){
    with(e){
    if (e.flag == 1){
    style.left = offsetLeft + e.offset;
    style.top = offsetTop + e.offset;
    e.flag = 0;
    }else{
    style.left = offsetLeft - e.offset;
    style.top = offsetTop - e.offset;
    e.flag = 1;
    }
    }
    e.timerId = setTimeout(mouserOver, 100, e);
    }window.onload = function() {
    document.getElementById ("xxx").appendChild(new OutputLayer("testLayer", 100, 100, 3).layer);
    }
    </script>
    <body>
    <div id="xxx"></div>
    </body>
    </html>