关于setTimeout中函数未定义的问题

buqibushe 2011-03-12 09:52:37

大家好，我现在实现一个当鼠标移动到该对象上时，对象慢慢的向右移，当离开对象时，慢慢地向左移，即还原原来的位置，代码如下：



    var left_most = -145;

    var right_most = 10;

    var the_timeout = null;

    

    $('#slider_menu').mouseover(function(){ // to right

        clearTimeout(the_timeout);

        the_timeout = setTimeout("slideToRight();", 1);

    }).mouseout(function(){// to left

        clearTimeout(the_timeout);

        the_timeout = setTimeout("slideToLeft();", 5000);  //5s后开始往左移

    });

    

    function slideToRight()

    {

        var left_pos = parseInt($('#slider_menu').css("left"));    

        //alert(left_pos);    

        if (left_pos > right_most) {

            clearTimeout(the_timeout);

            return;

        } else {

            left_pos += 1;// 坐标加5px

            left_pos += 'px';

            //alert(left_pos); 

            $(this).css("left", left_pos);

            the_timeout = setTimeout("slideToRight();", 1);//调用本身，继续移动，直到right_most

        } 

    }

    

    function slideToLeft()

    {

        var left_pos = parseInt($('#slider_menu').css("left"));    

        //alert(left_pos);    

        if (left_pos < right_most) {

            clearTimeout(the_timeout);

            return 0;

        } else {

            left_pos -= 5; // 坐标减5px

            left_pos += 'px';

            //alert(left_pos); 

            $(this).css("left", left_pos);

            the_timeout = setTimeout("slideToLeft();", 1);//调用本身，继续移动，直到left_most



        }

    }

在用firebug调试时，出现
slideToRight is not defined
[在此错误处中断] the_timeout = setTimeout("slideToRight();", 1);
slideToLeft is not defined
[在此错误处中断] the_timeout = setTimeout("slideToLeft();", 5000);

所有的类似的这种句子都提示出错
但是我很明显已经定义了，为什么会提示不对呢？是不是函数的作用域不同？或者setTimeOut中有何特定的设置，这个代码我是基于jquery，之前用原生的javascript写过，是可以用的！多谢大家了

...全文

359 5 打赏收藏转发到动态举报

写回复

用AI写文章

5 条回复

切换为时间正序

请发表友善的回复…

发表回复

buqibushe 2011-03-15

打赏
举报

都不行，还是函数未定义，

上海程序员3 2011-03-14

打赏
举报

会不会是变量名跟id号，函数名之类的冲突

wishifef 2011-03-12

打赏
举报



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<HTML>

 <HEAD>

  <TITLE> New Document </TITLE>

  <META NAME="Generator" CONTENT="EditPlus">

  <META NAME="Author" CONTENT="">

  <META NAME="Keywords" CONTENT="">

  <META NAME="Description" CONTENT="">

  <script type="text/javascript" src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'></script>

  <script type="text/javascript">

  	var left_most = -145;

    var right_most = 10;

    var the_timeout = null;

	$(function(){

		$('#slider_menu').mouseover(function(){ // to right

			clearTimeout(the_timeout);

			the_timeout = setTimeout("slideToRight();", 1);

		}).mouseout(function(){// to left

			clearTimeout(the_timeout);

			the_timeout = setTimeout("slideToLeft();", 50);  //5s后开始往左移

		});

	})



	function slideToRight()

    {

		//alert(1)

		$("#a").html($('#slider_menu').css("left")+"a");

        var left_pos = parseInt($('#slider_menu').css("left"));    

        //alert(left_pos);    

        if (left_pos > right_most) {

            clearTimeout(the_timeout);

            return;

        } else {

            left_pos += 1;// 坐标加5px

            left_pos += 'px';

            //alert(left_pos); 

            $('#slider_menu').css("left", left_pos);

            the_timeout = setTimeout("slideToRight();", 1);//调用本身，继续移动，直到right_most

        } 

    }

    

    function slideToLeft()

    {

		//alert(2)

		$("#b").html($('#slider_menu').css("left")+"b");

        var left_pos = parseInt($('#slider_menu').css("left"));    

        //alert(left_pos);    

        if (left_pos < left_most) {

            clearTimeout(the_timeout);

            return 0;

        } else {

            left_pos -= 5; // 坐标减5px

            left_pos += 'px';

            //alert(left_pos); 

            $('#slider_menu').css("left", left_pos);

            the_timeout = setTimeout("slideToLeft();", 1);//调用本身，继续移动，直到left_most



        }

    }

  </script>

 </HEAD>



 <BODY>

 <div id="a"></div>

  <div id="b"></div>

  <div id="slider_menu" style="position:absolute;left:0;width:200;height:200;background-color:blue"></div>

  

 </BODY>

</HTML>