我正在尝试为每个输出的数据库结果生成随机的div宽度。
代码在循环外工作,但每个div 都是相同的"随机"宽度。
- 加载页面,所有div 均为 200px
- 刷新页面,所有div 均为 150px
- 刷新页面,所有div都是250px...等。
问题是,我需要每个单独的div 都是一个随机宽度,而不是所有相同的随机宽度......出于这个原因,我在循环中添加了我的 JavaScript,以便在每次输出数据库值时获得新的"随机"宽度。
当然,这是行不通的!
<?php
$result = mysql_query("SELECT * from tbl_status ORDER BY tbl_status.date desc");
while($row = mysql_fetch_array($result))
{
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
var x = Math.floor((Math.random()*150)+150);
$('.statusCont').width(x+'px');
});
</script>
echo'
<div class="statusCont">
<div class="statusUsr">Tom Adams - Newcastle</div>
<div class="statusTxt"><p>' . $row['status'] . '</p></div>
</div><!-- ends .statusCont -->
';}
?>
所有div 具有相同随机宽度的原因是 jquery 类选择器 $('.statusCont')
将返回具有该类的所有元素。因此,当您的循环打印出最后一个选择器时,它将应用于所有先前加载的元素。
与其将javascript包含在php while
循环中,不如在head中编写一个脚本,该脚本将在加载后影响页面。
$(document).ready(function () {
$('.statusCont').each(function () {
var x = Math.floor((Math.random() * 150) + 150);
$(this).width(x);
});
);