【发布时间】:2018-03-14 10:45:53
【问题描述】:
我的 jQuery datepicker 代码运行良好。但是当我在同一页面上包含一个 jQuery 滑块/横幅时,日期选择器不起作用。我认为脚本标签可能与其他标签冲突。
Scripts under head tag:
//for datepicker
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="script.js"></script>
//for slider/banner
<link rel="stylesheet" href="nivo-slider/nivo-slider.css" type="text/css" media="screen"/>
<link rel="stylesheet" href="nivo-slider/themes/default/default.css" type="text/css" media="screen"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js" type="text/javascript"></script>
<script src="nivo-slider/jquery.nivo.slider.pack.js" type="text/javascript"></script>
html:
Search By Date <input type="text" id="datepicker" name="date">
<input type="submit" name="searchbydate" value="Search">
<script type="text/javascript">
$(window).on('load', function() {
$('#slider').nivoSlider();
});
</script>
script.js file
$(document).ready(function(){
$("#datepicker").datepicker({dateFormat: 'dd/mm/yy'});
});
滑块的PHP代码
<div class="slider-wrapper theme-default">
<div id="slider" class="nivoSlider">
<?php
include("dbConnect.php");
$query="select * from event_table where enable_disable='Enable'";
$result=mysqli_query($conn,$query);
if(mysqli_num_rows($result)>0)
{
while($row=mysqli_fetch_array($result))
{
//echo "<img src='images/".$row['image']."' title='".$row['description']."' height='400'>";
?>
<a href="event_details.php?eid=<?php echo $row['event_id']; ?>"><img src="images/<?php echo $row['image'] ?>" title="<?php echo $row['event_name'] ?>" height="450"></a>
<?php
}
}
else
{
echo "No Events";
}
mysqli_close($conn);
?>
</div>
</div>
我的滑块在开始和第二张幻灯片之后显示了 2 个额外的空白幻灯片,它工作正常。如何删除多余的空白幻灯片?
id="slider"的html代码
<div class="slider-wrapper theme-default">
<div id="slider" class="nivoSlider">
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Connection</title>
</head>
<body>
</body>
</html> <a href="event_details.php?eid=9"><img src="images/foot.jpg" title="Indian Super League 4" height="450"></a>
<a href="event_details.php?eid=10"><img src="images/volleyball.jpg" title="Pro Volleyball League" height="450"></a>
<a href="event_details.php?eid=11"><img src="images/nemo.jpg" title="Nemo Play" height="450"></a>
<a href="event_details.php?eid=12"><img src="images/walle.jpg" title="Robot Fight" height="450"></a>
<a href="event_details.php?eid=13"><img src="images/badminton.jpg" title="Premier Badminton League" height="450"></a>
<a href="event_details.php?eid=18"><img src="images/foot2.jpg" title="English Premier League" height="450"></a>
</div>
</div>
【问题讨论】:
-
删除其中一个 jQuerys - 例如
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js" type="text/javascript"></script> -
滑块/横幅在删除上面的 jquery 库时不显示。请帮忙。
-
是的。看我的回答
-
您需要加载正确的库,当然还有您没有发布的相关 html。查看控制台(按 F12)是否有任何错误
标签: javascript jquery html css datepicker