keyBoardMgr

hideKeyBoard showKeyBoard addKBListener removeKBListener onTextChanged

概述

有时在开发App时在刚进入某个页面时就需要为输入框自动获得焦点并弹出键盘以输入文字，比如修改用户名，发表心情，金额输入框等。有时候键盘弹出的时候底部fixed的内容会跟随键盘往上移，这时需要把底部fixed的内容隐藏掉，而键盘隐藏后把底部fixed的内容正常显示。但是一个纯 html 的输入框标签，无法实现这些功能。为满足ApiCloud开发者的这些需求，特开发了此插件。keyBoardMgr封装了与键盘相关的接口，包括弹出键盘、隐藏键盘、监听键盘弹出隐藏事件，实时监听input输入框的输入内容。

插件接口

hideKeyBoard

隐藏键盘。

hideKeyBoard(callback(ret))

callback(ret)

ret:

  • 类型：JSON对象
  • 描述：返回是否隐藏键盘成功
  • 内部字段：
{
        "status": 1, //1 or 0. 1隐藏成功
    }

示例代码

 var keyBoardMgr = api.require("keyBoardMgr");
 keyBoardMgr.hideKeyBoard(function(ret, err){
     api.toast({
         msg: "隐藏  "+JSON.stringify(ret)+""
         });
    });

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

showKeyBoard

针对某个输入框显示键盘，使某个输入框能够输入文字。需要调用该方法后，再用js使input获取焦点(因为弹出键盘需要一段时间，所以input获取焦点需要用setTimeout延时执行，如示例代码所示)，进而使input能够输入文字。对于安卓手机，弹出键盘后点击键盘以外的区域，部分手机能够关闭键盘，而部分手机不能关闭键盘(此时可通过键盘自带关闭按钮关闭)；对于苹果手机，弹出键盘后点击键盘以外的区域，都能够关闭键盘。

showKeyBoard(callback(ret))

callback(ret)

ret:

  • 类型：JSON对象
  • 描述：返回是否显示键盘成功
  • 内部字段：
{
        "status": 1, //1 or 0. 1显示成功
    }

示例代码

function focuson(){ 
     document.getElementById("sb_form_q").focus();//sb_form_q为input的id属性
}
 var keyBoardMgr = api.require("keyBoardMgr");
 keyBoardMgr.showKeyBoard(function(ret, err){
     api.toast({
         msg: "显示  "+JSON.stringify(ret)+""
         });
    });
setTimeout("focuson()",900);//为了适配各种系统版本的手机，延迟时间需要大于或等于900ms

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

addKBListener

添加监听键盘弹出隐藏事件。添加监听后，该插件会异步回调onKeyBoardChanged方法，onKeyBoardChanged方法由开发者自行实现。详见onKeyBoardChanged方法说明。不使用该监听事件后开发者应调用removeKBListener方法移除监听事件。

addKBListener(callback(ret))

callback(ret)

ret:

  • 类型：JSON对象
  • 描述：返回是否监听成功
  • 内部字段：
{
        "status": 1, //1 or 0. 1监听成功
    }

示例代码

 var keyBoardMgr = api.require("keyBoardMgr");
 keyBoardMgr.addKBListener(function(ret, err){
     api.toast({
         msg: JSON.stringify(ret)+""
         });
    });
function onKeyBoardChanged(isShow,height){
    if(isShow  == 1){
        api.toast({
            msg: "键盘弹出，高度："+ height,
        });
    }else if(isShow  == 0){
        api.toast({
            msg: "键盘隐藏，高度："+ height,
        });
    }
}

onKeyBoardChanged(isShow,height)

isShow:

  • 类型：数值型
  • 描述：键盘弹出还是隐藏，1：弹出； 0：隐藏。

height:

  • 类型：数值型
  • 描述：键盘高度，单位px。

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

removeKBListener

移除监听键盘弹出隐藏事件。调用addKBListener方法后开发者应在适当时候调用removeKBListener方法移除监听事件。

removeKBListener(callback(ret))

callback(ret)

ret:

  • 类型：JSON对象
  • 描述：返回是否移除成功
  • 内部字段：
{
        "status": 1, //1 or 0. 1移除成功
    }

示例代码

 var keyBoardMgr = api.require("keyBoardMgr");
 keyBoardMgr.removeKBListener(function(ret, err){
     api.toast({
         msg: JSON.stringify(ret)+""
         });
    });

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

onTextChanged

监听input输入框的内容变化，该方法为纯js实现，可以当做拓展本插件的功能。

onTextChanged()

示例代码

function onTextChanged(){ 
//sb_form_q为input的id属性
document.getElementById("sb_form_q").addEventListener("input",function(){
    api.toast({
        msg: "输入内容发生变化：" + document.getElementById("sb_form_q").value 
    });
 });
}

可用性

iOS系统，Android系统

可提供的1.0.0及更高版本

是否仍需要帮助？ 请保持联络！
最后更新于 2024/11/18