`
hecal
  • 浏览: 78199 次
社区版块
存档分类
最新评论

让下拉列表select可编辑的简便方法

    博客分类:
  • php
阅读更多

1
2 < select name ="markcode" onChange ="editable(this);" >
3 < option value ="value1" > 选项一 </ option >
4 < option value ="" > 请输入 </ option >
5 </ select >
6
7
8
9 < script language ="javascript" >
10 function editable(select1){
11 if (select1.value == "" ){
12 var newvalue = prompt( " 请输入 " , "" );
13 if (newvalue){
14 addSelected(select1,newvalue,newvalue);
15 }
16 }
17 }
18
19 function addSelected(fld1,value1,text1){
20 if (document.all){
21 var Opt = fld1.document.createElement( " OPTION " );
22 Opt.text = text1;
23 Opt.value = value1;
24 fld1.options.add(Opt);
25 Opt.selected = true ;
26 } else {
27 var Opt = new Option(text1,value1, false , false );
28 Opt.selected = true ;
29 fld1.options[fld1.options.length] = Opt;
30 }
31 }
32 </ script >
33
34
35

分享到:
评论

相关推荐

    可编辑的下拉列表!!

    以下是一个简单的实现可编辑下拉列表的JavaScript代码片段: ```html &lt;!DOCTYPE html&gt; 可编辑下拉列表 function updateList() { var select = document.getElementById('editableSelect'); var input = ...

    html select 可输入 可编辑

    `&lt;select&gt;`标签是HTML中用于创建下拉列表的元素,通常用于提供多个选项供用户选择。然而,标准的`&lt;select&gt;`元素并不支持用户直接输入自定义文本。为了实现一个既可输入又可编辑的下拉框效果,开发者通常会采用一些...

    layui下拉列表select实现可输入查找的方法

    5. 通过上述步骤,一个带有搜索功能的layui下拉列表select就实现了。 例如,假设有一个包含城市名称的下拉列表,用户需要从中选择一个城市。在传统的select下拉列表中,如果列表项较多,用户可能需要滚动很长一段...

    select下拉框可编辑输入框

    在网页设计中,"select下拉框可编辑输入框"是一种常见的交互元素,它结合了传统的HTML `&lt;select&gt;` 元素和输入框的功能,让用户在下拉选项中选择的同时,也能自由输入其他值。这样的设计增加了用户体验的灵活性,特别...

    Editable Select 可编辑select

    - **JavaScript库插件**:许多前端框架和库如jQuery、Vue.js、React等都有专门的可编辑Select插件,如Select2、react-select等,它们提供了丰富的API和配置选项,便于集成到项目中。 - **CSS和JavaScript自定义**:...

    c#可输入的下拉列表框

    "C#可输入的下拉列表框"是一种交互式控件,它结合了传统的下拉列表功能和文本输入框的功能,允许用户既可以从中选择已有的选项,也可以自由输入新的值。这种控件在提高用户体验和数据输入灵活性方面起到了重要作用。...

    可编辑的select下拉框

    在网页开发中,`&lt;select&gt;`元素通常用于创建下拉列表,但它的功能相对有限,不支持用户自定义输入或实时搜索。为了增强用户体验并提供更丰富的交互性,开发人员通常会利用JavaScript库或插件来扩展这个基本的HTML元素...

    写一个可编辑的select下拉框

    一个常见的需求是实现一个可编辑的`&lt;select&gt;`下拉框,即允许用户不仅能从下拉列表中选择选项,还能直接输入文本。这种组件结合了传统`&lt;select&gt;`控件的选择功能和`&lt;input&gt;`控件的自由文本输入能力,从而提供更加灵活...

    几款极好的 JavaScript 下拉列表插件

    Selectize(https://selectize.github.io/selectize.js/)是一个轻量级且可定制的插件,它将输入框和下拉列表结合在一起,支持创建、编辑和选择选项。它适用于那些需要用户输入新选项或进行多选的场景。Selectize也...

    ListView 实现可编辑或双击出现下拉列表框

    总结起来,实现ListView可编辑或双击出现下拉列表框的功能,需要对ListView的基础操作有深入理解,包括事件处理和自定义控件的使用。通过适当的编程技巧,我们可以为用户提供更丰富的交互体验,提高应用的易用性。在...

    解决element-ui里的下拉多选框 el-select 时,默认值不可删除问题

    el-select组件允许用户在一个下拉列表中选择一个或多个选项。在多选模式下,用户可以通过点击“x”图标来移除已经选中的标签(tag)。然而,在某些业务场景下,我们可能需要设置一些默认选项,而这些默认选项是不...

    C# winform ListView 中实现可编辑文本或双击出现下拉列表框

    通过以上方法,我们可以为C# WinForm中的ListView控件增加可编辑文本和双击出现下拉列表的功能,极大地提高了用户体验和交互性。这个过程涉及到对控件事件的处理、控件的动态创建和定位,以及一些基本的UI设计原则,...

    js使下拉列表框可编辑不止是选择

    在HTML中,下拉列表框(select元素)默认情况下是不可编辑的,用户只能从提供的选项中进行选择。但是,有时需要允许用户直接编辑下拉列表框的内容,而不是只能选择预设的值。为实现这一需求,可以使用JavaScript来...

    bootstrap可编辑下拉框jquery.editable-select

    Bootstrap可编辑下拉框jQuery.editable-select是一款增强型的下拉选择组件,它允许用户在下拉列表中直接编辑文本,并提供了丰富的自定义选项。这个组件基于流行的前端框架Bootstrap和JavaScript库jQuery,使得在Web...

    最完美的select美化下拉框

    这是一款堪称最完美的下拉框组件,特点如:美化的并且可自定义的外观、使用简单、支持分组、下拉列表展开的方向智能化、下拉框可编辑、集成了ajax联动功能、自定义下拉列表的列数、完美的浏览器兼容性等。...

    editable select

    在实际应用中,要使用这个插件,你需要将`jquery.js`和`jquery.editable-select.js`(以及可能的CSS文件)引入到HTML页面中,然后通过jQuery选择器选取需要变为可编辑的下拉列表,并调用`.editableSelect()`方法。...

    可编辑的下拉框

    这是一款堪称最完美的下拉框组件,特点如:美化的并且可自定义的外观、使用简单、支持分组、下拉列表展开的方向智能化、下拉框可编辑、集成了ajax联动功能、自定义下拉列表的列数、完美的浏览器兼容性等。...

    bootstrap-table可编辑下拉框editable js及css及bootstrap-table-editable.js以及使用实例

    在本话题中,我们聚焦于Bootstrap Table的一个扩展功能——可编辑下拉框,这得益于`bootstrap-table-editable`插件的使用。这个插件允许用户在表格的单元格内直接进行编辑,包括选择下拉框中的值。 `bootstrap-...

    select将选中的option设置为默认选项

    在网页开发中,`&lt;select&gt;`元素用于创建下拉列表,而`&lt;option&gt;`标签则定义了下拉列表中的选项。有时候,我们可能需要在页面加载时预设一个选项为默认选中状态,或者根据用户操作动态改变选中状态。在JavaScript中,这...

Global site tag (gtag.js) - Google Analytics