androidjdx
androidjdx
  • 发布:2016-08-17 14:27
  • 更新:2016-08-17 14:50
  • 阅读:8701

input输入框,默认的键盘是换行,我想变成搜索改怎么弄

分类:MUI

<div class="mui-input-row mui-search" style="margin: 5px;">
<input id="searchInput" onkeyup="enterSearch(event)" type="search" class="mui-input-clear" placeholder="请输入搜索关键字">
</div>

手机上弹出的键盘没有搜索

2016-08-17 14:27 负责人:无 分享
已邀请:

最佳回复

赵梦欢

赵梦欢 - 专注前端,乐于分享!

为了监听软键盘右下角按键事件,我们常采用下面的方法:

html:

<div class="mui-input-row mui-search">  
    <input id="search" type="search" class="mui-input-clear" placeholder="">  
</div>

javascript:

document.getElementById('search').addEventListener('keydown',function (e) {  
    console.log(e.keyCode);  
    if(e.keyCode == 13){  
        console.log("search");  
    }  
})

但是这种方法在部分手机软键盘兼容性不好,所以不妨采用绑定form表单提交事件:

html:  
<form action="">  
    <input type="search" name="username">  
    <button type="submit" class="mui-btn mui-btn-block">搜索</button>  
</form>

javascript:

document.querySelector('form').addEventListener('submit', function(e){  
    e.preventDefault(); // 阻止默认事件  
    console.log("搜索");  
});

注: 通过修改form 表单下input的type属性值为text可以改变软键盘右下角的文字为go。

该问题目前已经被锁定, 无法添加新回复