项目上要实现既可以输入又可以选择的输入框类似于百度的搜索自动提示
实现代码如下
searchSelect.js
var flag = false;//标记点击也面时输入框下方的div是否消失
var selectOptions = null;//输入框提示的option数组
function inputSelect(){
if(arguments.length == 0 ){
alert("未传入参数");
return ;
}
if(typeof arguments[0] != "string"){
alert("第一个参数请传入字符串");
}
var reg = /[#\.]?./;
if(!reg.test(arguments[0])){
alert("输入参数表达式不正确");
return ;
}
var select = $(arguments[0]);
//给selectInput添加输入框内文本改变事件在IE下为oninput在其他浏览器下为onpropertychange
var selectInput = "<input id='" + "selectInputClone" + "' oninput='onInput(this);' onpropertychange='onPropertyChange(this);' type='text' name='" + select.attr("name") + "'></input>";
var selectDiv = "<div id='" + "selectDiv" + "'></div>";
var selectOption_ = select.find("option");
selectOptions = new Array(selectOption_.length);
var childrenOption = null;
for(var i = 0; i < selectOption_.length; i++){
childrenOption = selectOption_.get(i);
//alert(childrenOption);操蛋jquery的查找语句找出来的是DOM对象而不是jquery对象
selectOptions[i] = $(childrenOption);
}
//移除原生的select,添加新的input
select.before(selectInput);