select 下拉列表可编辑

最新推荐文章于 2024-07-29 12:13:58 发布

时间辜负了谁

最新推荐文章于 2024-07-29 12:13:58 发布

阅读量3.2k

点赞数 2

分类专栏： JavaScript 文章标签： select 下拉列表可编辑 select easyui function

JavaScript 专栏收录该内容

14 篇文章 0 订阅

订阅专栏

1、javascript方式：

  <select name="markcode" onChange="editable(this);">
    <option value="value1">选项一</option>
    <option value="">请输入</option>
    </select>

<script language="javascript">
function editable(select1){
   if(select1.value == ""){
      var newvalue = prompt("请输入","");
      if(newvalue){
         addSelected(select1,newvalue,newvalue);
      }
   }
}

function addSelected(fld1,value1,text1){
    if (document.all)    {
            var Opt = fld1.document.createElement("OPTION");
            Opt.text = text1;
            Opt.value = value1;
            fld1.options.add(Opt);
            Opt.selected = true;
    }else{
            var Opt = new Option(text1,value1,false,false);
            Opt.selected = true;
            fld1.options[fld1.options.length] = Opt;
    }
}
</script>

2、easyui方式：

function editable(select1){
		if(select1.value == ""){
			$.messager.prompt('添加', '添加新关键字', function(r){
				if(r){
					addSelected(select1,r,r);
				}
	         });
		}
	}

	function addSelected(fld1,value1,text1){
	    if (document.all)    {
	            var Opt = fld1.document.createElement("OPTION");
	            Opt.text = text1;
	            Opt.value = value1;
	            fld1.options.add(Opt);
	            Opt.selected = true;
	    }else{
	            var Opt = new Option(text1,value1,false,false);
	            Opt.selected = true;
	            fld1.options[fld1.options.length] = Opt;
	    }
	}