Как сгладить таблицу строк с помощью JQuery?

Мне было интересно, как я могу сдвинуть строку таблицы из моего сценария.Как сгладить таблицу строк с помощью JQuery?

У меня есть php-файл, который включен в html-страницу внутри div, называемого 'output-listings'.

PHP FILE:

<?php 
function outputListingsTable() 
{ 
    $mysql = new mysqli('localhost', 'root', 'root', 'ajax_demo') or die('you\'re dead'); 
    $result = $mysql->query("SELECT * FROM explore") or die($mysql->error); 

    if($result) 
    { 
     echo "<div class=\"main-info\"> \n"; 
      echo "<table class=\"listings\"> \n"; 
       echo "<tbody> \n"; 

        while($row = $result->fetch_object()) 
        { 
         $id = $row->id; 
         $siteName = $row->site_name; 
         $siteDescription = $row->site_description; 
         $siteURL = $row->site_url; 
         $sitePrice = $row->site_price; 


         echo " <tr id=\"more-info-" .$id. "\" class=\"mi-" .$id. "\"> \n"; 
           echo " <td> \n"; 
           echo "  <div id=\"more-" .$id. "\" class=\"more-information\"></div> \n"; 
           echo " </td> \n"; 
         echo " </tr> \n"; 

         echo " <tr id=\"main-info-" .$id. "\"> \n"; 
         echo "  <td>" . $siteName . "</td> \n"; 
         echo "  <td>" . $siteURL . "</td> \n"; 
         echo "  <td><a id=\"link-" . $id . "\" class=\"more-info-link\" href=\"#\">More info</a></td> \n"; 
         echo " </tr> \n"; 
        } 
     echo "</tbody> \n"; 
    echo "</table> \n"; 
echo "</div> \n";   

    } 

} 

?>

Как вы можете видеть выше скрипт создает динамические идентификаторы и классы, которые меня смущает о том, как выбрать их с помощью Jquery.

Вот jquery, который у меня есть до сих пор, но не работает печально.

$(function() { 

$("a.more-info-link").click(function() { 

$("#more-info-" + this.id).load("getinfo.php").slideToggle("slow"); 

return false; 

}); 

});

Любая помощь будет замечательной.

источник

2009-07-11 Anonymous

$("a.more-info-link").click(function() { 
    var id = $(this).attr("id").substring(4); // This extract the id from the link's id field 
    $(#more-info-" + id).load("getinfo.php", function() { 
     $(this).slideToggle("slow"); 
    }); // I suppose you want to toggle after the content was loaded? or you can keep your statement 
});

Посмотрите, работает ли оно?

источник

2009-07-11 02:51:48 xandy

Это не работает, видимо, есть незаконный символ после загрузки getinfo.php? где начинается функция. – 2009-07-11 03:30:22

Возможно, вы можете разместить свой «сгенерированный» html вместо страницы PHP здесь. Чтобы мы могли больше ориентироваться на самих html и js. – xandy

Вместо того, чтобы таргетировать строку, вставьте содержимое в div внутри строки и примените анимацию к div.

<html> 
    <head> 
     <title>SandBox</title>  
    </head> 
    <body> 
     <table> 
      <tr> 
       <td> 
        <div id="divMoreInfo"> 
         some text or whatever goes here. 
        </div> 
       </td> 
      </tr> 
      <tr id="main-info-"> 
       <td> 
        <a id="link" href="#">More info</a> 
       </td> 
      </tr> 
     </table> 
    </body> 
</html> 
<script src="js/jquery.js" type="text/jscript" ></script> 
<script type="text/javascript"> 
    $("#link").click(function() { 
     $("#divMoreInfo").slideToggle(200); 
    }); 
</script>

источник

2009-07-11 02:57:01

Как сгладить таблицу строк с помощью JQuery?

ответ

Смежные вопросы