javascript - Ajax 内容在 firebugs 中不可见，无法使用 hover 功能

Question

当用户输入查询时，我使用 ajax 调用来生成内容，在我尝试使用 jquery 的悬停功能之前它运行良好。

$(document).ready(function() {
  $(".numbers").hover(function(){
    $(".fullUnits").fadeIn(80);
    $(".units").fadeOut(0);    
  }, function(){
    $(".fullUnits").fadeOut(0);
    $(".units").fadeIn(80);
  });
});

上面的代码实际上是正确的，它不起作用，因为.number 对浏览器是不可见的。这就是它在 firebugs 中的样子。灰色表示不可见。所以你不能悬停在上面。(抱歉，我现在不能发布图片)

Screenshot http://converteveryunit.com/firebug.png

以下代码为ajax代码，用于生成内容

function showHint()
{
  var str = document.getElementById("inputText").value;
  if (str.length==0)
  { 
    document.getElementById("txtHint").innerHTML="";
    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)
    {
      document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
    }
  }
  var query = "gethint.php?q="+str;
  if (document.getElementById("m2u").checked) 
  {
    query = query + "&mode=m2u";
  }
  else if (document.getElementById("u2m").checked) 
  {
    query = query + "&mode=u2m";
  }

  xmlhttp.open("GET",query,true);
  xmlhttp.send();

}

如果您需要其他代码，演示位于 converteveryunit.com

Answer 1

你必须在内容加载后绑定(bind)你的悬停事件