[TOC]

UIInput 是一個輸入框模塊
1. 輸入框可自動獲取焦點,并彈出鍵盤
2. 可自定義輸入框的位置及樣式
3. 監聽輸入框內容的變化
4. 用于實現搜索框或其它輸入框的 autofocus 及彈出鍵盤功能
# 心得
1. open的關鍵是位置
2. 通過function(ret){}來執行操作
3. 比如商城的搜索框
# open
打開輸入框,注意:**調用 open 接口的元素,不能加 tapmode 屬性**
~~~
var UIInput = api.require('UIInput');
UIInput.open({
rect: {
x: 0,
y: 0,
w: 320,
h: 40
},
styles: {
bgColor: '#fff',
size: 14,
color: '#000',
placeholder: {
color: '#ccc'
}
},
maxRows: 1,
placeholder: '這是一個輸入框',
keyboardType: 'number',
fixedOn: ''
}, function(ret){
status: true,
eventType: 'show'
//show(模塊打開成功)
//change(輸入框內容改變)
//search(點擊鍵盤的搜索按鈕)
if(ret.status){
alert(ret.eventType);
}
});
~~~
> if(ret.eventType == change) 執行關鍵詞對比
> if(ret.eventType == search) 執行搜索,
> 通過value的ret.msg得到輸入的內容,傳遞給其他方法
> 完成搜索
# close
~~~
var UIInput = api.require('UIInput');
UIInput.close();
~~~
# show
~~~
var UIInput = api.require('UIInput');
UIInput.show();
~~~
# hide
~~~
var UIInput = api.require('UIInput');
UIInput.hide();
~~~
# value
~~~
var UIInput = api.require('UIInput');
//設置輸入框的值
UIInput.value({
msg: '設置輸入框的值'
});
//獲取輸入框的值
UIInput.value(function(ret, err){
if(ret.status){
api.alert({msg: ret.msg});
}
});
~~~
#insertValue
~~~
var UIInput = api.require('UIInput');
//設置輸入框的值
UIInput.value({
msg: '設置輸入框的值'
});
//獲取輸入框的值
UIInput.value(function(ret, err){
if(ret.status){
api.alert({msg: ret.msg});
}
});
~~~