我正在编写一个脚本,我必须显示一些与域类型相关的查询(这里提到的类型为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();
如何解决这个问题?
答案 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>