Jquery在JSFIDLE上运行良好，但在localhost上不起作用_Jquery_Html

Jquery在JSFIDLE上运行良好，但在localhost上不起作用

jquery html

Jquery在JSFIDLE上运行良好，但在localhost上不起作用,jquery,html,Jquery,Html,我有一个关于jsfiddle的代码，它工作得很好这里是链接但是当我尝试在我的机器上运行代码时，jquery不起作用 <html><head> <title></title> <style type="text/css"> .custom-dropdown { position:relative;} .custom-dropdown .table-wrapper { max-he

我有一个关于jsfiddle的代码，它工作得很好这里是链接

但是当我尝试在我的机器上运行代码时，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>


.自定义下拉列表{
位置：相对；}
.自定义下拉列表.表包装器{
最大高度：150像素；
溢出y：自动；
位置：绝对位置；
顶部：21px；
边框：1px实心#ccc；
溢出-x:隐藏；}
.自定义下拉列表.下拉表{
宽度：300px；}
$（函数（）{
$（'.dropdown table'）。可搜索({
条纹：是的，
搜索类型：“模糊”
});
$（“.dropdown search”）.bind（“keyup”，函数（）{
var$this=$（this）；
var$table=$this.next（）；
如果（$this.val（）.length>0&&$table.is（“：hidden”））{
$table.show（）；
}否则{
$table.hide（）；
}
var resultCount=（$table.find（“tr:visible”）.length-1）；
$table.find（“.search result counter”）.html（resultCount+“已找到记录”）；
});
});
测验
ccc
一些
更多

这个程序可以在JSFIDLE上运行，但是当我在我的计算机上运行这个程序时，jquery没有任何效果

请帮助

尝试以下代码。下面是我在你的代码中发现的错误

缺少可搜索的插件
Jquery版本非常旧/包含不同版本的Jquery库
删除其他jquery库包含并添加以下代码

在fiddle中，您使用的是jQuery 1.11.0版，请检查是否在代码帮助中更改了它。您为什么两次包含jQuery？当您说“在我的计算机上”时，您是指本地web服务器还是仅仅指一个文件？我想您没有包含

jQuery.searchable-1.0.0.min.js

您有多个jQuery引用Yeah。。谢谢。。。伙计。。在添加了jquery可搜索插件之后，它对我很有效：）使用旧的jquery版本并不是一个错误，只是一个糟糕的做法。然而，例如。包含jQuery两次，特别是在其他脚本之间，确实会导致问题。@Regent同意。使用旧版本不是错误。只是一个坏习惯。无论如何，包括可搜索插件解决了他的问题。@DonX如何编辑答案，指出不添加可搜索插件脚本和建议使用较新版本的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>