Php 无法从ajax get向表行添加类_Php_Jquery

Php 无法从ajax get向表行添加类
php jquery
Php 无法从ajax get向表行添加类,php,jquery,Php,Jquery,我试图将类添加到一行$（'tr:first child'）.next（）.addClass（“当前”）完整html <!DOCTYPE html> <html><head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <title>All Rows</title> <script type="text/javas
我试图将类添加到一行
$（'tr:first child'）.next（）.addClass（“当前”）
完整html
<!DOCTYPE html>
<html><head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <title>All Rows</title>

  <script type="text/javascript" src="jquery.js"></script>

  <style type="text/css">
    .container {padding-left: 20px; padding-right: 20px;}
.forms{
display:inline-block;
margin-top:2%;
}

.buttons{border:1px solid #708090;}
input {margin-bottom:2%;margin-right:5%;}

button{margin-right:3%;}

.forms{border-top:3px solid #708090;}
.tableholder{height:300px; overflow-y:auto;}
.current{background-color:pink;}
  </style>
<script type="text/javascript">
$(document).ready(function(){

   $.get("getall.php", function(data){       
    {
     $('.tableholder').append(data);
    } 
    });

$('tr:first-child').next().addClass("current");

$("#next").click(function(){
$("table").find('.current').removeClass("current");
});
});

</script>
</head>
<body>
<div id="sc" class="container">
<div class="tableholder">
</div>
</div>
</body></html>


所有行
.container{左填充：20px；右填充：20px；}
.表格{
显示：内联块；
利润率最高：2%；
}
.按钮{边框：1px实心#708090；}
输入{页边距底部：2%；页边距右侧：5%；}
按钮{右边距：3%；}
.forms{边框顶部：3px实心#708090；}
.tableholder{高度：300px；溢出-y:auto；}
.current{背景色：粉红色；}
$（文档）.ready（函数（）{
$.get（“getall.php”，函数（数据）{
{
$（'.tableholder'）。追加（数据）；
} 
});
$（'tr:first child'）.next（）.addClass（“当前”）；
$（“#下一步”）。单击（函数（）{
$（“表”）.find（'.current'）.removeClass（“current”）；
});
});

还有我的php脚本。不要担心不推荐使用的mysql函数。我们使用旧的php安装
<?php
  $host = "localhost";
  $user = "root";
  $pass = "";
  $databaseName = "caliban";
  $tableName = "caliban";
  $con = mysql_connect($host,$user,$pass);
  $dbs = mysql_select_db($databaseName, $con);
  $result = mysql_query("SELECT * FROM $tableName");            
  $array = mysql_fetch_assoc($result);                           

$result = mysql_query("SELECT * FROM $tableName");           

$rows = Array();
$i=0;
while($row = mysql_fetch_assoc($result)){
        //array_push($rows, $row);
      $rows[$i++] = $row;
}

echo "<table id='tab' border='1'>
<thead>
<tr>
<th><form><input type='checkbox' /></form></th>
<th>firstname</th>
<th>lastname</th>
<th>city</th>
<th>continent</th>
</tr>
</thead>
<tbody>";

for($j=0;$j<count($rows); $j++){
$id = $rows[$j]['id'];
$firstname = $rows[$j]['firstname'];
$lastname = $rows[$j]['lastname'];
$city = $rows[$j]['city'];
$continent = $rows[$j]['continent'];

      echo 
      "<tr id='$id' class=''>
<td><input type='checkbox' /></td>
<td>$firstname</td>
<td>$lastname</td>
<td>$city</td>
<td>$continent</td>
</tr>";
}

echo "</tbody>
</table>";
?>

这是您的代码块
$(document).ready(function(){

    $.get("getall.php", function(data){       
        {
            $('.tableholder').append(data);
        } 
    });

    $('tr:first-child').next().addClass("current");

$.get
调用是异步的，这意味着脚本将在返回结果之前继续。因此,
$('tr:first-child').next().addClass("current");

以前有人打过电话
$('.tableholder').append(data);

请尝试以下方法：
$(document).ready(function(){

    $.get("getall.php", function(data){       
        {
            $('.tableholder').append(data);
            $('tr:first-child').next().addClass("current");
        } 
    });

这是您的代码块
$(document).ready(function(){

    $.get("getall.php", function(data){       
        {
            $('.tableholder').append(data);
        } 
    });

    $('tr:first-child').next().addClass("current");

$.get
调用是异步的，这意味着脚本将在返回结果之前继续。因此,
$('tr:first-child').next().addClass("current");

以前有人打过电话
$('.tableholder').append(data);

请尝试以下方法：
$(document).ready(function(){

    $.get("getall.php", function(data){       
        {
            $('.tableholder').append(data);
            $('tr:first-child').next().addClass("current");
        } 
    });

您的.get（）
请求是异步的，因此当您尝试应用该样式时，还没有表。附加数据后应用样式
$.get("getall.php", function(data) {
    $('.tableholder').append(data);
    $('tr:first-child').next().addClass("current"); 
});

您的.get（）
请求是异步的，因此当您尝试应用该样式时，还没有表。附加数据后应用样式
$.get("getall.php", function(data) {
    $('.tableholder').append(data);
    $('tr:first-child').next().addClass("current"); 
});

试试这个：
$(document).ready(function () {

    $.get("getall.php", function (data) {

            $('.tableholder').append(data);
            $('tr:first-child').next().addClass("current");

    });



    $("#tab").on('click','#next',function () {
        $("table").find('.current').removeClass("current");
    });
});

顺便说一句，ID在上下文页面上必须是唯一的，这意味着只有一个元素可以具有ID“next”
尝试以下操作：
$(document).ready(function () {

    $.get("getall.php", function (data) {

            $('.tableholder').append(data);
            $('tr:first-child').next().addClass("current");

    });



    $("#tab").on('click','#next',function () {
        $("table").find('.current').removeClass("current");
    });
});

顺便说一句，ID在上下文页面上必须是唯一的，这意味着只有一个元素可以具有ID“next”
您可以发布生成的HTML代码吗？您所说的“无法应用该类”是什么意思。您是否使用DOM查看器检查了该表，以查看它是否应用于错误的元素？是否有任何控制台错误？$.get是异步的ajax。看起来您的#next元素是动态添加的。您可以发布生成的HTML代码吗？您所说的“类无法应用”是什么意思。您是否使用DOM查看器检查了该表，以查看它是否应用于错误的元素？是否有任何控制台错误？$.get是异步的ajax。看起来您的#下一个元素也被动态添加