js实现下拉框选“其他”，显示输入框并获取输入框内容

代码小轩

已于 2024-08-12 17:19:25 修改

阅读量245

点赞数 1

文章标签： javascript 前端开发语言

于 2024-08-12 17:01:20 首次发布

本文链接：https://blog.csdn.net/qq_41823964/article/details/141136321

版权

js实现下拉框选“其他”，显示输入框并获取输入框内容

project.php

<select id="implement" name="implement" style="width: 100%" class="form-comtril pull-left" type="text">
<option value="1">1</option>
<option value="2">2</option>
<option value="其他">其他</option>
<input id="select_else" style="width: 100%" style="display:none" class="form-control pull-left" type="text">
</select>

project.js

function openEdit(index){//编辑一条记录
var thisImplement=implementList[index];//获取数据
$("#implement").val(thisImplement.implement);
if((thisImplement.implement!="1")&&(thisImplement.implement!="2")){
document.getElementById("select_else").style.display="block";
$("#implement").val("其他");//回显
$("#select_else").val(thisImplement.implement);//回显
}
document.getElementById("implement").addEventListener('change', function(){//监听
if(this.value==="其他"){
document.getElementById("select_else").style.display="block";//显示输入框
}else{
document.getElementById("select_else").style.display="none";
}
});

function save(){//保存
var a=$("#implement").val();
if(document.getElementById("select_else").value.trim()!=''){
a=document.getElementById("select_else").value;
}
var params={//向后端传参数
"implement": a
}
…//调用后端接口，修改数据
}