jQuery的滑块和jQuery自动完成

Question

我一直在一个页面上使用一个jQuery自动完成，这样当你在客户输入其名字搜索数据库，包含这个词组的任何macth。所以使用“LIKE”。 我也放在一起jquery silder，以便它显示从数据库中自动加载的记录，当你点击一个它会从数据库加载更多的信息.​​.

indivaully thesse 2段代码工作正常所以在一个serprate页面上的jquery自动完成只是从数据库中加载文本输入。 和jQuery的滑块工作正常，手动输入的数据和数据从PHP数据库加载的数据..

但当我把它们放在一起的问题是它显示在屏幕上的记录与jquery滑块的样式，但是当ü点击记录它没有显示任何东西，所以没有滑块（atm只是手动html数据在滑块中进行测试）

我已经尝试了多种测试，如运行它们s​​erpeatre，将它们放在不同的div标签中。我已经得到它与单个SQL查询，但它不是我需要做的，因为我不希望页面需要刷新加载数据。

我已经把我的代码从两个文件，因此日是第一个是什么叫Ajax请求创建记录..

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
<script type="text/javascript"> 
    $(function(){ 
    $(".recordrow").click(function() { 
     var divid = "details-" + $(this).attr('id').split("-")[1]; //Create the id of the div 
     $("#"+divid).show().animate({ "right": '0%'}); //Bring the div from right to left with 200px padding from the screen 
    }); 

    $('#bt-close').click(function(){ 
    $('.details').animate({right:-2000}, 500); 

    }); 

    }); 


    function getStates(value){ 

    $.post("sql.php",{partialState:value},function(data){ 
    $("#results").html(data); 
    }); 
    } 
    </script> 

    <input type="text" onkeyup="getStates(this.value)"/> 
    <br /> 
    <div id="results"> 

    </div> 

这是querys数据库的页面

<?php 
if($_POST['partialState']){ 
mysql_connect("localhost","root")or die (mysql_error()); 
mysql_select_db("ict_devices") or die (mysql_error()); 

$test=$_POST['partialState']; 
$text="... More details of the records"; 

$states = mysql_query("Select * from students Where FirstName LIKE '%$test%'"); 

while($state= mysql_fetch_array($states)){ 
echo '<div class="recordrow" id="row-$state["id"]">'.$state['FirstName'].'</div>'; 
echo '<div class="details" id="details-$state["id"]">'.$text.'<a href="#" id="bt-close">Close</a></div>'; 
} 
} 
?> 

任何帮助将大大approgated

Answer 1

我认为你需要绑定“recordrow”div后，通过ajax获得它的点击功能。在您的代码中，点击事件绑定时没有“记录”。所以你需要这样的东西：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
<script type="text/javascript"> 
    function getStates(value){ 
     $.post("sql.php", function(data){ 
      $("#results").html(data); 
      $('.recordrow').each(function() { 
       $(this).bind('click', function() { 
        var divid = "details-" + $(this).attr('id').split("-")[1]; //Create the id of the div 
        $("#"+divid).show().animate({ "right": '0%'}); //Bring the div from right to left with 200px padding from the screen 
       }); 
      }); 
      $('#bt-close').each(function() { 
       $(this).bind('click', function(){ 
        $('.details').animate({right:-2000}, 500); 
       }); 

      }); 
     }); 
    } 
</script> 

你的ajax是正确的，当你测试已经在DOM中的滑块记录时，点击正确绑定。这就是为什么它的作品的部分

编辑：我测试我的代码，并添加绑定bt关闭事件，它为我工作，尝试它。它显示详细信息点击，动画推出