CSS& jQuery代码在第200次迭代中以明文形式打印[php]

时间:2014-11-14 22:00:50

标签: php jquery html css

我正在编写一个脚本,我必须显示一些与域类型相关的查询(这里提到的类型为X&类型Y)。所以我使用了jquery slidetoggle函数&一点点的css.Things工作完美,直到第200次迭代 直到第199次迭代数据正确显示,缩进如下:

Click To show  typeX data
//Some data shown via toggle

Click To show  typeY data
//Some data shown via toggle

但除此之外,它打印所有数据和甚至jQuery,css作为连续的文本行,甚至break标记都不起作用。这样的事情:

$(document).ready(function(){ $("#typeX201").click(function(){ $("#typeX201").slideToggle("slow"); }); }); $(document).ready(function(){ $("#typeY201").click(function(){ $("#itypeY201").slideToggle("slow"); }); }); #typeX,#typeY { background-color:#cccccc; border:solid 1px #a9a9a9; } #TypeX201,#typeY201 { display:none; }
//followed by some data

以下是我的PHP代码:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<?php

    class Delete_bm
    {

    function __construct($site)
    {       
         //Creating DB Connection
    }

    function __destruct()
    {
           //Closing DB Connection
    }
    function display_data()
    {       

            $sql="Some SQL query;

        $res=mysql_query($sql,$this->db_cluster1);
                $i=1;
                while ($line = mysql_fetch_assoc($res)) 
                {  ?>
                    <script> 
            $(document).ready(function(){
              $("#typeX<?php echo $i?>").click(function(){
                $("#typeXqry<?php echo $i?>").slideToggle("slow");
              });
            });
            $(document).ready(function(){
              $("#typeY<?php echo $i?>").click(function(){
              $("#typeYqry<?php echo $i?>").slideToggle("slow");
              });
            });
               </script>
            <style>
            #typeX?php echo $i?>,#typeY<?php echo $i?>
            {
            background-color:#cccccc;
                        border:solid 1px #a9a9a9;
            }
                        #typeXqry<?php echo $i?>,#typeYqry<?php echo $i?>
                        {
                         display:none;
                        }
            </style>
                   <div id="typeX<?php echo $i?>"><b>Click to show typeX Query</b></div>
                   <div id="typeXqry<?php echo $i?>">
    <?php                  $str="Some Query";
                       //typeX text to be displayed in every iteration;?>
    <div id="typeXqry<?php echo $i?>">
    <?php                  $str="Some Query";
                       //typeX text to be displayed in every iteration;?>
    $i++;
    }                    
    }
    }
    $list = new Delete_bm();
    $data = $list->display_data();

如何解决这个问题?

1 个答案:

答案 0 :(得分:1)

将此部分保留在循环之外。没有必要像这样复制代码。

<script>
    $(document).ready(function() {
        $(".typeX, .typeY").click(function() {
            $(this).next().slideToggle("slow");
        });
    });

</script>
<style> .typeX, .typeY { background-color:#cccccc; border:solid 1px #a9a9a9; } .Xqry, .Yqry { display:none; } </style>

你的循环应该只输出这些东西。

<br><b>199:Domain name:abc.com<br>
<div id="typeX199" class="typeX"><b>Click to show typeX Query</b></div>
<div id="Xqry199" class="Xqry"> //MySQL Queries <br><br> </div>
<div id="typeY199" class="typeY"><b>Click to show typeY Query</b></div>
<div id="Yqry199" class="Yqry"> //MySQL Queries <br><br> </div>