`
clone168
  • 浏览: 7436 次
  • 性别: Icon_minigender_1
  • 来自: 成都
文章分类
社区版块
存档分类
最新评论

再谈“可输入的下拉框”,完全支持中文输入

阅读更多

记得前段时间大家对可输入的下拉框讨论的比较多,可惜的是最终都没能完美的支持中文,就我自己写的程序和看的另外几个跟帖的程序都只能支持IE下面的中文输入,其实这样的话,在现实中的实用价值并不大,试想一下,在firefoxchrome下面访问的话,都只能输入英文肯定让用户抓狂了。

楼主当时的办法是扩展事件处理函数,这个想法很赞,这里提供另外一种思路,原理其实也很简单:动态生成一个input,利用css叠放在相应的select上面,这样的话,只要元素的位置控制的好,能起到“以假乱真”的效果,很显然,支持中文,兼容性也非常好!

代码在附件里面,欢迎大家拍砖,如果能对代码进行优化,那就感激不尽了~

 

  • input_select.rar (2.3 KB)
  • 描述: 支持中文输入的下拉框
  • 下载次数: 869
分享到:
评论
4 楼 clone168 2009-10-26  
<p>楼上的想法很不错,这个我之前真的没想到,好,等我忙完这一段时间的finding job,以后一定贴出我的想法来!</p>
3 楼 yangsp1 2009-10-26  
但这样好像不支持像google baidu那种联想词的连动效果。。。。

输入一个字或词时,下拉框返回相应的一个或多个相关数据。

1:通过ajax返回的数据如何用select下拉框显示出来?
   A:难道先清除select中原来所有的数据吗?
   B:用div实现。(如果这样的话是不是完全可以不用select)

2:如果客户端select中已经保存了所有数据,你这种方法如何完全不用
   刷新请求服务器端。只用js实现联想词显示? 并且进行中英文排序

我做过一个用ajax,pinyin4j.jar,div实现的。但代码做的相当混乱而且很不通用。

效果:1:输入词时:
      2:点击下拉图标时:

请教作者更好的解决方法。
谢了先。
2 楼 clone168 2009-09-07  
<div class="quote_title">tof.j 写道</div>
<div class="quote_div">IE6中有问题</div>
<p> </p>
<p>呵呵,那天由于疏忽,没有在IE下面测试,其实这里又遇到了IE下面那个select的经典问题~</p>
<p>我把代码进行了修复,不过由于时间关系,没有做进一步的优化处理</p>
<p>谢谢提醒!</p>
1 楼 tof.j 2009-09-07  
IE6中有问题
发表评论

文章已被作者锁定,不允许评论。

相关推荐

    可输入下拉框(html控件)

    简单javavscript实现的可输入下拉框(仿VC的comobox),用于html网页开发。 不懂代码的,可直接在页面中插入该源码实现,方便易用。

    js 可输入下拉框(jquery)

    在JavaScript和jQuery的世界里,"js 可输入下拉框(jquery)"是一个常见的交互设计需求,它结合了传统下拉框的简洁性与输入框的搜索功能,为用户提供更友好的交互体验。这种组件通常被称为“Autocomplete”或...

    asp.net可输入可选择下拉框

    在这种情况下,“asp.net可输入可选择下拉框”应运而生,它结合了文本框和下拉框的优点,提供了更灵活的交互体验。 首先,我们需要理解这个自定义用户控件的工作原理。通常,它是通过JavaScript或者jQuery在客户端...

    可输入下拉框(select)源代码

    在网页设计中,"可输入下拉框"(通常称为Autocomplete或Typeahead下拉框)是一种增强用户体验的交互元素。传统的HTML `&lt;select&gt;` 标签仅允许用户从预定义的选项中选择,但可输入下拉框允许用户在输入时获取匹配建议...

    asp.net可输入下拉框

    将CheckBox Text两个空间结合,简易的制作可输入下拉框

    可以输入的下拉框 下拉框和文本框组合共用

    可以输入的下拉框. 下拉框和文本框组合共用可以输入的下拉框. 下拉框和文本框组合共用可以输入的下拉框. 下拉框和文本框组合共用可以输入的下拉框. 下拉框和文本框组合共用可以输入的下拉框. 下拉框和文本框组合共用...

    这是一个可输入下拉框组件

    "可输入的下拉框组件"是一个常见的UI元素,广泛应用于各种Web应用和桌面软件中。这样的组件结合了传统的下拉框与搜索输入框的功能,极大地提高了用户在大量数据选择时的便捷性。 首先,我们来理解一下“下拉框”的...

    可输入的下拉框

    "可输入的下拉框"是一种常见的交互元素,它结合了传统下拉菜单与搜索输入框的功能,使得用户在选择选项时可以更加高效和精确。这种设计常见于网页和应用程序中,用于提供多样化的选择并允许用户通过输入关键词快速...

    两种方式生成可输入下拉框。

    在网页设计中,创建可输入的下拉框是一种常见的交互元素,它允许用户在下拉选项中进行选择,同时也可以手动输入新的值。本篇将详细介绍两种方式来实现这一功能,主要面向熟悉HTML和JavaScript的开发者。 ### 方式一...

    comBox可输入下拉框

    在IT行业中,"comBox可输入下拉框"是一种常见的用户界面组件,它结合了文本输入框和下拉选择框的功能。这样的设计旨在提供更灵活的用户体验,允许用户既可以手动输入值,也可以从预设的选项中进行选择。在网页开发中...

    支持手动输入的下拉框

    在IT界,尤其是在前端开发中,“支持手动输入的下拉框”是一种常见的用户界面元素,它结合了传统下拉选择框的功能与文本输入框的优势,为用户提供更灵活、高效的交互体验。这种组件通常被称为“自动补全”或“类型...

    【ASP.NET编程知识】ASP .NET 可编辑输入自动匹配的下拉框.docx

    ASP.NET 可编辑输入自动匹配的下拉框 本文将详细介绍 ASP.NET 可编辑输入自动匹配的下拉框的实现方法,该控件可以自动匹配用户输入的内容,并提供相关的下拉选项。本文将从三个方面介绍该控件的实现方法:首先,...

    转载:再谈“可输入的下拉框”,完全支持中文输入

    标题中的“可输入的下拉框”通常指的是在网页或应用程序设计中的一种交互元素,它结合了下拉选择框和文本输入框的功能。用户不仅可以从预定义的选项中选择,还可以自行输入文字进行搜索或创建新的选项。这种设计提高...

    可输入下拉框可输入下拉框

    标题中的“可输入下拉框”通常指的是在网页或应用程序设计中的一种交互元素,它结合了文本输入框和下拉列表的功能。用户可以既可以直接在输入框中输入文本,也可以从下拉列表中选择已有选项,这种设计常用于提供用户...

    可输入下拉框jquery插件

    总之,"可输入下拉框jQuery插件"提供了一种便捷的方式来增强网页中下拉框的功能,使其支持用户输入和筛选,提升了用户体验。通过学习和应用这个插件,开发者可以为自己的网站或应用添加这一实用特性。同时,对于...

    可文本输入的下拉框select

    在网页开发中,"可文本输入的下拉框select"是一种常见的交互元素,它结合了传统的HTML `&lt;select&gt;` 下拉菜单和自由文本输入的功能。这种设计可以为用户提供更灵活的选择方式,既可以快速从预设选项中选取,也可以手动...

    php可输入下拉框控件

    二、可输入下拉框控件 为了实现一个可输入的下拉框,我们可以利用JavaScript或者jQuery库来增强原生的HTML下拉框。这样的控件允许用户在输入框中直接键入文本,同时仍然提供下拉列表供用户选择。当用户开始输入时,...

    可输入的下拉框.rar

    在网页设计中,"可输入的下拉框"是一种交互元素,它结合了传统下拉框的紧凑性和输入框的灵活性,为用户提供更便捷的搜索和选择体验。这种设计常见于需要用户从大量选项中快速查找或输入特定值的场景,如城市选择、...

    可手写输入的下拉框,代码少,简单

    在一些特定场景下,例如对中文、日文、韩文等非拉丁字符集的支持,手写输入特别有用,因为这些语言的字符数量庞大,用户可能记不住所有键位对应的文字。 在实现这个功能时,开发人员可能会采用HTML5的Canvas元素来...

Global site tag (gtag.js) - Google Analytics