简体   繁体   English

jQuery Searchable DropDown插件不起作用

[英]jQuery Searchable DropDown Plugin doesn't work

I can't get it to do anything. 我什么也做不了。 The drop down just behaves normally. 下拉菜单的行为正常。 I've followed their instructions and created the simplest demo I could and still nothing works. 我按照他们的指示创建了我能做的最简单的演示,但仍然没有任何效果。 I've checked my paths and put everything in the same directory to make sure everything is being found. 我已经检查了路径并将所有内容放在同一目录中,以确保找到所有内容。 I have jQuery being loaded first. 我先加载了jQuery。

Here's the html file: 这是html文件:

<!doctype html>
<html>
<head>
  <title>Searchable</title>
  <script src="jquery-1.9.1.js"></script>
  <script src="jquery.searchabledropdown-1.0.8.src.js"></script>
  <script type="text/javascript">
        $(document).ready(function() {
            $("select").searchable();
        });
  </script>
</head>
<body>
<select id="myselect">
    <option value="0">Aardvark</option>
    <option value="1">Beta</option>
    <option value="2">Charlie</option>
    <option value="3">Louis Chan</option>
    <option value="4">Zoomba</option>
    <option value="5">Lima</option>
</select>  
</body>
</html>

Here's a link to the plugin. 这是插件的链接。 Demo is on the plugin page: http://jsearchdropdown.sourceforge.net/ 演示在插件页面上: http : //jsearchdropdown.sourceforge.net/

this works for me: 这对我有用:

<!doctype html>
<html>
<head>
  <title>Searchable</title>
    <script type="text/javascript" src="http://jsearchdropdown.sourceforge.net/jquery-1.7.1.min.js"></script>
    <script type="text/javascript" src="http://jsearchdropdown.sourceforge.net//jquery.searchabledropdown.js"></script>
   <script type="text/javascript">
        $(document).ready(function() {
            $("select").searchable();
        });
  </script>
</head>
<body>
<select id="myselect">
    <option value="0">Aardvark</option>
    <option value="1">Beta</option>
    <option value="2">Charlie</option>
    <option value="3">Louis Chan</option>
    <option value="4">Zoomba</option>
    <option value="5">Lima</option>
</select>  
</body>
</html>

It seems like the $.browser has been removed from jquery 1.9 core and above see the reference here you can decide to fix the problem by changing the library, use an older jquery version or use another alternative here you can find some better examples. 似乎$ .browser已从jquery 1.9核心中删除,并且在上面可以看到参考您可以通过更改库,使用较旧的jquery版本或使用其他替代方法来解决此问题,在这里您可以找到一些更好的示例。

Good luck! 祝好运!

I downloaded the code and tested it. 我下载了代码并对其进行了测试。 The problem is jQuery 1.9.1, when I put that version it does not work, but when I put back jQuery 1.8.3 it works. 问题是jQuery 1.9.1,当我放那个版本时它不起作用,但是当我放回jQuery 1.8.3时它起作用。 I don't think there is a way to solve it unless you dig in the library, so it's better to use 1.8.3 as in the demo. 我认为除非您在库中进行挖掘,否则没有解决方法,因此在演示中使用1.8.3更好。

For the above Example: Once you searched the key like 'Zoo..' then you can select 'Zoomba' . 对于上述示例:一旦搜索了诸如“ Zoo ..”之类的键,则可以选择“ Zoomba” Again If want to change the selection , in that list you can able to see only 'Zoomba' not all values. 同样,如果要更改选择 ,则在该列表中,您只能看到“ Zoomba”,而不是所有值。

If you want to show all values in that list you have to clear that searched key once selected index changed . 如果要显示该列表中的所有值,则必须在选定索引更改后清除该搜索键。 Like this, 像这样,

 <!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> <head> <meta charset="utf-8" /> <title>Searchable</title> <script type="text/javascript" src="http://jsearchdropdown.sourceforge.net/jquery-1.7.1.min.js"></script> <script type="text/javascript" src="http://jsearchdropdown.sourceforge.net//jquery.searchabledropdown.js"></script> <script type="text/javascript"> $(document).ready(function() { $('#myselect').searchable(); $('#myselect').change(function() { $(this).autocomplete('search', ''); }); }); </script> </head> <body> <select id="myselect"> <option value="0">Aardvark</option> <option value="1">Beta</option> <option value="2">Charlie</option> <option value="3">Louis Chan</option> <option value="4">Zoomba</option> <option value="5">Lima</option> </select> </body> </html> 

You written code is fine, It is a browser and Jquery version related issue. 您编写的代码很好,这是与浏览器和Jquery版本有关的问题。

  1. Runs on IE 7.x, IE 8.x, Firefox 3.5.x, Safari 4.x, Opera 10.x, Chrome 3.x 在IE 7.x,IE 8.x,Firefox 3.5.x,Safari 4.x,Opera 10.x,Chrome 3.x上运行

It uses version Jquery 1.7.2 and Jquery UI 1.8.18 它使用版本Jquery 1.7.2和Jquery UI 1.8.18

Also use plugin http://effinroot.eiremedia.netdna-cdn.com/repo/plugins/forms-controls/searchabledropdown/jquery.searchabledropdown.js 还可以使用插件http://effinroot.eiremedia.netdna-cdn.com/repo/plugins/forms-controls/searchabledropdown/jquery.searchabledropdown.js

You can check the running version on JSFiddle http://jsfiddle.net/JWyRZ/ 您可以在JSFiddle http://jsfiddle.net/JWyRZ/上查看正在运行的版本

You always can use jquery-browser-plugin plugin from https://github.com/gabceb/jquery-browser-plugin . 您始终可以从https://github.com/gabceb/jquery-browser-plugin使用jquery-browser-plugin插件。 It adds the functionality missed by upgrade to 1.9. 它增加了升级到1.9所缺少的功能。 Just make sure you load jquery first and jquery-browser plugin afterwards. 只需确保先加载jquery,然后再加载jquery-browser插件即可。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM