我在jsfiddle上有一个代码可以正常工作 链接在这里 Jsfiidle code
但是当我尝试在我的机器上运行代码时,jquery无法运行..
<html><head>
<title></title>
<style type="text/css">
.custom-dropdown {
position:relative;}
.custom-dropdown .table-wrapper {
max-height: 150px;
overflow-y:auto;
position:absolute;
top:21px;
border:1px solid #ccc;
overflow-x:hidden;}
.custom-dropdown .dropdown-table {
width: 300px;}</style>
<script src="http://code.jquery.com/jquery-1.7.1.min.js" type="text/javascript"></script>
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<script type="text/javascript">
$(function () {
$('.dropdown-table').searchable({
striped: true,
searchType: 'fuzzy'
});
$(".dropdown-search").bind("keyup", function () {
var $this = $(this);
var $table = $this.next();
if ($this.val().length > 0 && $table.is(":hidden")) {
$table.show();
} else {
$table.hide();
}
var resultCount = ($table.find("tr:visible").length - 1);
$table.find(".search-result-counter").html(resultCount + " records found.");
});
});
</script>
</head>
<body>
<div class="custom-dropdown">
<input type="search" id="search" value="" class="dropdown-search" placeholder="Search">
<div class="table-wrapper">
<table class="dropdown-table">
<thead>
<tr>
<th colspan="4">
<span class="search-result-counter"></span>
</th>
</tr>
</thead>
<tbody>
<tr>
<td>Test</td>
<td>ccc</td>
<td>Some</td>
<td>More</td>
<td>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</body>
</html>
这个程序适用于jsfiddle但是当我在我的计算机上运行时,jquery没有任何效果 请帮忙
答案 0 :(得分:0)
尝试以下代码。以下是我在代码中发现的错误
Jquery版本是非常旧的/不同版本的jquery库包含
删除其他jquery库包含并添加以下代码
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script> <script src="http://rawgithub.com/stidges/jquery-searchable/master/dist/jquery.searchable-1.0.0.min.js"></script>