0

このデモにはいくつかのバグがあります。同じイベントを同じクラスに追加したいが、 ID を比較したい。このようなコード

    var self;
    var id;
    var result;
    var myArray=document.getElementsByClassName("tipDiv");
    for (var i=0;i<myArray.length;i++)
        {
            document.getElementsByClassName("tipDiv")[i].onmouseover=(function(num){
                return function() {            
                    $(this).myHoverTip("hoverDiv","");
                    }
            })(i);   
            document.getElementsByClassName("tipDiv")[i].onmouseout=(function(num){
                return function() {            
                    $(this).cleanHover("hoverDiv");
                    }
            })(i);        
        }


$.fn.myHoverTip = function(divId, value) 
   {
        var div = $("#" + divId); 
        div.css("position", "absolute");
        self = $(this); 
        id = self.attr("id");
        self.hover(function() 
            {
            div.css("display", "block");
            var p = self.position(); 
            var x = p.left + self.width();
            var docWidth = $(document).width();
            if (x > docWidth - div.width() - 20) 
                {
                x = p.left - div.width();
            }
            div.css("left", x);
            div.css("top", p.top);
                function showCustomer(str)
                {
                var xmlhttp;
                if (str=="")
                  {
                  result="";
                  return;
                  }
                if (window.XMLHttpRequest)
                  {// code for IE7+, Firefox, Chrome, Opera, Safari
                  xmlhttp=new XMLHttpRequest();
                  }
                else
                  {// code for IE6, IE5
                  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
                  }
                xmlhttp.onreadystatechange=function()
                  {
                  if (xmlhttp.readyState==4 && xmlhttp.status==200)
                    {
                    result=xmlhttp.responseText;
                    }
                  }
                xmlhttp.open("GET","getbrand.asp?q="+str,true);
                xmlhttp.send();
                div.html(id+result+myArray.length);
                }
            showCustomer(id);

            },

    function() {
        div.css("display", "none");
        div.html("");
    }
    );

 return this;
}

バグを修正するのを手伝ってください...それは私が望むようには機能しません。最初の mousemoveover でホバーが機能しません。次に、間違った値を取得します。3 回目の moveover で正しい値を取得します。そして、次の DIV に移動します。最後の値を取得します。私を助けてください ！私の英語でごめんなさい。

4

1 に答える 1

0

document.getElementsByClassName("tipDiv")まず第一に、forloop で再度行う必要はありません。これはすでに に保存されているmyArrayので、そのまま使用できますmyArray[i]。

しかし、jquery とホバー機能を使用しないのはなぜですか? api.jquery.com/hover。これにより、クラスを選択するだけです：

$(".hoverDiv").hover(...)

これは私が推測するあなたにとってそれをより簡単にするでしょう..

または jquery の mouseOver 関数を使用します: http://api.jquery.com/mouseover/

于 2013-09-09T09:29:40.717 に答える