文本框实现下拉列表联动

　　昨天做了一个文本框过滤下拉列表选项的东西，技术不复杂，记录下来一遍提高再使用效率。

 $(‘#searchOption‘).keyup(function(){
                var val = $(‘#searchOption‘).val()

                $("#editable-select option").remove()

                ITEMS=  ["Alfa Romeo",    "Audi",    "BMW",    "Citroen",    "Fiat",    "Ford",    "Jaguar",    "Jeep",    "Lancia",    "Land Rover",    "Mercedes",    "Mini",    "Nissan",    "Opel",    "Peugeot",    "Porsche",    "Renault"]
                $.each(ITEMS, function(i, item) {
                    console.log(item+"-"+val+"-"+item.indexOf(val))
                    if(item.indexOf(val) != -1){
                        $(‘#editable-select‘).append(‘<option value="">‘+ item + ‘</option>‘);
                    }

                })

　　在文本框的onkeyup事件上做监听，动态的操作select的选项，做到过滤

　　svn up -r 1234 item.py (tc)

时间： 2024-08-24 18:05:03

文本框实现下拉列表联动的相关文章

Easy UI下拉列表默认选中（多行）与为文本框赋值

1.为单行文本框赋值 var data2 = $('#LoadArea').combobox("getData"); if (data2) { $('#id).combobox('select','1'); } 2.为多行文本框赋值 var area = $('#id).combobox("getData"); if (area) { var arry="1,2".split(','); $('#LoadArea').combobox('setV

JAVA EE 项目经常使用知识之AJAX技术实现select下拉列表联动的两种使用方法（让你真正理解ajax）

ajax 下拉列表联动的使用方法. ajax的定义: AJAX 是一种用于创建高速动态网页的技术. 通过在后台与server进行少量数据交换,AJAX 能够使网页实现异步更新.这意味着能够在不又一次载入整个网页的情况下,对网页的某部分进行更新. ajax效果的一个样例: 区域为空的时候,维护人情况: 选了一个区域后的情况:(选舒城县联带出来的维护人员小刘) 一.原生态的js实现 XMLHttpRequest 是 AJAX 的基础 XMLHttpRequest 对象全部现代浏览器均支持 X

JAVA EE 项目常用知识之AJAX技术实现select下拉列表联动的两种用法（让你真正理解ajax）

ajax 下拉列表联动的用法. ajax的定义: AJAX 是一种用于创建快速动态网页的技术. 通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新. ajax效果的一个例子: 区域为空的时候,维护人情况: 选了一个区域后的情况:(选舒城县联带出来的维护人员小刘) 一.原生态的js实现 XMLHttpRequest 是 AJAX 的基础 XMLHttpRequest 对象所有现代浏览器均支持 XMLHttp

表单开发(二):获取单选按钮，多行文本框，下拉菜单，捆绑元素数据，用户注册

单选按钮:<input type="radio"> 多行文本框:<textarea rows="5" cols="30"></textarea> 下拉菜单:seclet option <select name="home" > <option value="北京">北京</option> <o

从零开始学android<AutoCompleteTextView随笔提示文本框.十九.>

随笔提示功能可以很好的帮助用户进行方便的信息输入,而在Android之中也提供了与之类似的功能,而这个功能的实现就需要依靠android.widget.AutoCompleteTextView类完成,此类的继承结构如下: java.lang.Object ? android.view.View ? android.widget.TextView ? android.widget.EditText ? android.widget.AutoCompleteTextView No. 方法类型描述

Bootstrap 表单和图片（内联表单，表单合组，水平排列，复选框和单选框，下拉列表，校验状态，添加额外的图标，控制尺寸，图片）

一．表单基本格式注:只有正确设置了输入框的 type 类型,才能被赋予正确的样式. 支持的输入框控件包括:text.password.datetime.datetime-local.date.month.time.week. number.email.url.search.tel 和 color. <form> <div class="form-group"> <label>电子邮件</label> <input type=&

基于MVC3下拉列表联动（JQuery）

MVC3 上次项目中遇到一个需要多个下拉列表联动的操作,今天有空将实现方式整理以便以后参考. 要达到的效果是,点击一个下拉框,则另一个下拉框的值发生对应变化.如:选择中国,则另个一下拉框里显示中国各个省份. 传统的HTML方式比较简单,实际上基于MVC的实现方式也大同小异. 直接上代码: public class DP_Provice { public int proviceID { get; set; } public string ProviceName

JS获取文本框值

一.获取文本框/编辑框/隐藏域框 <script type="text/javascript">function Mycheck(){ var checkstr="获取内容如下:\n"; if (document.form1.文章作者.value != ""){ checkstr+="作者名称:"+document.form1.文章作者.value+"\n"; } if (doc

下拉列表联动显示（Car表）三级联动

1.Models namespace 下拉列表联动显示_Car表_.Models { public class ProductorBF { private MyDBDataContext _context=new MyDBDataContext(); public List<productor> Select() //厂商全部显示 { return _context.productor.ToList(); } } } namespace 下拉列表联动显示_Car表_.Models { publ