0
我有jQuery脚本循环随机次数的问题，我不知道为什么。这里是我的代码：jQuery脚本循环不明原因
<!DOCTYPE html>
<html lang="en">
<head>
<?php
include 'head.php'
?>
</head>
<body>
<div id="container">
<!-- Header -->
<?php
include 'header.php'
?>
<!-- Navigation Bar -->
<?php
include 'navigation.php'
?>
<!-- Gallery section -->
<section class="articles">
<h1><a href="projects.php?cat=All">Projects</a></h1>
<hr>
<div id="infoblock">
<?php
if (!empty($_GET['id'])) {
require 'info.php';
}
else {
if (!empty($_GET['cat'])) {
require 'maingallery.php';
}
else {
echo '<p>Database error, please reload your page';
};
};
?>
</div>
</section>
<!-- Footer -->
<?php
include 'footer.php'
?>
</div>
</body>
</html>
所以我的问题与需要maingallery.php。这是maingallery.php代码：
<div id="filterbuttons">
<h4 class="selected" id="All" href="gallery.php" >All</h4>
<h4 id="Residential" href="gallery.php?cat=Residential" >Residential</h4>
<h4 id="Modernisation+%26+Domestic+Extensions" href="gallery.php?cat=Modernisation+%26+Domestic+Extensions" >Modernisation & Domestic Extensions</h4>
<h4 id="Feasibility+Layouts" href="gallery.php?cat=Feasibility+Layouts" >Feasibility Layouts</h4>
<h4 id="Master+Planning" href="gallery.php?cat=Master+Planning" >Master Planning</h4>
</div>
<ul class="gallery">
<div id="gallerylist">
<?php require 'gallery.php'; ?>
</div>
</ul>
，这是gallery.php：
<?php
if (!empty($_GET)) {
$cat = urldecode($_GET['cat']);
}
else {
$cat = 'All';
};
$dbc = mysqli_connect('server.microlite10.com','XXXXXX','XXXXXX','avd');
if ($dbc) {
getGallery($cat, $dbc);
}
else {
echo '<p>Database error, please refresh your screen!</p>';
};
function getGallery($cat, $dbc) {
$r = 'SELECT * FROM Projects';
$q = mysqli_query($dbc,$r);
while ($row = mysqli_fetch_array($q, MYSQLI_ASSOC)) {
if ($cat == 'All') {
echo '<li class="item">
<a class="info" href="info.php?id='.$row['id'].'"><img src="'.$row['thumbnail'].'" width="212" height="119" alt="'.$row['name'].'"></a>
<h2><a class="info" href="info.php?id='.$row['id'].'">'.$row['name'].'</a></h2>
<h3><a class="cat" href="gallery.php?cat='.urlencode($row['category']).'">'.$row['category'].'</a></h3></li>';
}
else {
if ($row['category']==$cat) {
echo '<li class="item">
<a class="info" href="info.php?id='.$row['id'].'"><img src="'.$row['thumbnail'].'" width="212" height="119" alt="High Tor East, Earl Shilton"></a>
<h2><a class="info" href="info.php?id='.$row['id'].'">'.$row['name'].'</a></h2>
<h3><a class="cat" href="gallery.php?cat='.urlencode($row['category']).'">'.$row['category'].'</a></h3></li>';
};
};
};
}
?>
<script type="text/javascript">
// Assign $cat value to variable
// and find relative <h4> element to assign selected class
var cat = "<?php echo urlencode($cat); ?>";
alert('script executed');
$("h4").each(function() {
var id = $(this).attr('id');
if (cat == id) {
$(this).addClass('selected');
}
else {
$(this).removeClass('selected');
};
});
$("li.item:visible").each(function(i) {
if((i+1)%4==0) $(this).css("margin","30px 0 30px 0px");
else $(this).css("margin","30px 20px 30px 0");
});
$('.cat').bind('click', function(e) {
var href = $(this).attr('href');
$('#gallerylist').load(href);
e.preventDefault();
});
$('h4').bind('click', function(e) {
var href = $(this).attr('href');
$('#gallerylist').one().load(href);
var stateObj = { foo : "bar" };
var newurl = $(this).attr('id');
history.pushState(stateObj, "", ('http://www.damianwojtczak.com/avd2/projects.php?cat='+newurl));
e.preventDefault();
});
$('.info').bind('click' , function(e) {
var href = $(this).attr('href');
$('#infoblock').load(href);
e.preventDefault();
});
</script>
所以我的问题是与jQuery脚本添加到gallery.php文件。当我点击任何h4元素时，jQuery正在重新加载带有新内容的#gallerylist元素并阻止默认操作。对于前几个点击它工作正常，但似乎来自'gallery.php'文件的脚本正在循环出于某种原因而不点击任何h4元素。我添加了'alert'消息来检查我的脚本执行了多少次，并且无法弄清楚为什么它会循环。
你可以在这里检查这个问题http://www.damianwojtczak.com/avd2/projects.php?cat=All，只是尝试点击过滤元素（所有，住宅等），你会注意到脚本循环，因为警报出现几次。
完美！解决了这个问题。谢谢 – Guferos 2013-02-09 16:47:08