mui+回复弹出软键盘

最近再做一个APP的时候,有一个评论回复的功能,在做APP的时候,直接用手指触发focus事件,来唤醒软键盘的弹出没有问题, 但是现在的功能需要对点击回复进行弹出软键盘来操作,参考过很多都有问题,后来仔细看了下官方的DEMO,发下这个问题是可以被解决掉的。具体方法如下:

<style type="text/css">
.show-input-main{width: 100%; height:40px; border: 1px solid red;  position: fixed; left:0px; bottom:0px; z-index: 20;}
.show-input-box{width: 100%; height:40px; padding-right:55px;}
.input-box{width: 100%; height:100%; background:yellow;}
.input-box-btn{width: 55px; height: 100%; background: #007aff; position: absolute; top:0px; right:0px; text-align:center; line-height: 40px; color:#fff; font-size:16px;}
#textarea-input{width: 100%; height:38px; border:1px solid #fff; line-height: 24px; min-height:38px; margin:0px; padding:5px 2px; }
</style>
<div class="mui-input-row">
    <button id="showInput">点我回复</button>
</div>
<div class="mui-input-row show-input-main">
    <div class="show-input-box">
        <div class="input-box">
            <textarea id="textarea-input"></textarea>
        </div>
        <div class="input-box-btn">发送</div>
    </div>
</div>

具体JS代码:

var showInputObj = document.getElementById(‘showInput‘);
var clickShowSoftInput = function(){
    if (mui.os.android) {
        imm.toggleSoftInput(0, InputMethodManager.SHOW_FORCED);
    } else {
        nativeWebview.plusCallMethod({
            "setKeyboardDisplayRequiresUserAction": false
        });
    }
    setTimeout(function() {
        var inputElem = document.querySelector(‘#textarea-input‘);
        inputElem.focus();
        inputElem.parentNode.classList.add(‘mui-active‘); //第一个是search,加上激活样式
    }, 200);
};
mui.plusReady(function() {
    initNativeObjects();
    // 监听点击事件
    showInputObj.addEventListener(‘tap‘,function(){
        clickShowSoftInput();
    });
});

经测试没有问题。

原文地址:https://www.cnblogs.com/e0yu/p/10364952.html

时间: 02-12

mui+回复弹出软键盘的相关文章

弹出软键盘时,不把activity整体往上移,只移动部分

如图,EditText在整个activity的最下方,当弹出软键盘时,如果整个activity往上移动,会导致最上面那些部分会看不见,而中间又还有这么多空白的空间,显然不合理. 为了只移动activity中的部分空间,可以将这块部分放在ScrollView中,设置ScrollView的layout_weight="1",即让他占满空位.当弹出软键盘时,就会去移动这部分的空间了.

android的alertdialog中加入edittext但是不弹出软键盘等问题的解决与原因

摘要:alertdialog中加入edittext但是不弹出软键盘等问题网上有很多不管用的解决方案, 本文意在给出更有效的解决办法,并初步探究其原因 正文 在对话框中插入文本框是十分常见的需求 通常我们选择在代码中创建edittext对象 这个时候就需要在代码中给edittext设置输入属性了 但是经常发现设置的属性不起作用,甚至都不弹出软键盘(虽然实体键盘可以输入) 问题的解决方案有很多种,这里介绍一种我比较常用的方法: inputPassEditText.setInputType(Input

Cocos2d-X中使用CCTextFieldTTF的简单应用显示文本和弹出软键盘

 学了几天Cocos2d-X后今天终于可以试试Cocos2d-X的跨平台开发了,由于条件的限制,我只会测试Cocos2d-X在Android平台上的开发,今天就以一个简单的文本测试Android上的效果,需要用到CCTextFieldTTF类,CCTextFieldTTF是一个显示文本控件的类用于输入文本和现实文本类似于Windows编程中的Static控件和Edit控件 程序实例:使用TextFieldTTF类创建一个文本,触摸文本弹出软键盘 首先创建一个TextFieldTTF.h的头文

[Phonegap+Sencha Touch] 移动开发24 打包wp8.1的App,运行时输入框聚焦弹出软键盘之后,界面上移而不恢复原位的解决办法

这个现象只出现在phonegap打包sencha touch的wp8.1程序会出现(仅wp8.1,wp8正常),其它js框架我测试了几个(app framework, jquery mobile),好像没有这个问题. 我来描述一下这个现象: 1.运行phonegap打包的wp8程序,打开一个有输入框的界面,如下图: 2.点击输入框,使其弹出软键盘,界面会上移,如下图: 3.点返回键隐藏软键盘(或者点击界面上其它地方隐藏软键盘),此时界面不恢复原位,如下图: 我的一些研究结果: 1.这种现象只出现

禁止移动端input弹出软键盘

在做三级联动,或者一些时间插件的时候总是弹出软键盘,用下面的方法就可以禁用掉,废话不多说直接上代码. HTML代码 <div class=""> <div> <input type="text" id="disable1" class="" placeholder=""/> </div> <div> <input type="tex

android edittext不弹出软键盘

EditText 不弹出软件键盘2011-05-17 12:291.EditText默认不弹出软件键盘 方法一: 在AndroidMainfest.xml中选择哪个activity,设置windowSoftInputMode属性为adjustUnspecified|stateHidden 例如:<activity android:name=".Main"                   android:label="@string/app_name"   

打开页面默认弹出软键盘,同时兼容iOS和Android

// 示例1 open_soft_keyboard({ input: "#username" }); // 示例2 open_soft_keyboard({ input: 'input[value=""]' }); /** * 默认打开软键盘 * @param options{ * input: '#nickname' // 容器节点 * } * @author 蔡繁荣 * @version 1.0.3 build 20151226 */ function open

android自动弹出软键盘(输入键盘)

searchEditView.setFocusable(true); searchEditView.setFocusableInTouchMode(true); searchEditView.requestFocus(); Timer timer = new Timer(); timer.schedule(new TimerTask() { public void run() { InputMethodManager inputManager = (InputMethodManager) sea

[转]android自动弹出软键盘(输入键盘)

转自:http://www.devdiv.com/home.php?mod=space&uid=65729&do=blog&id=11847 很多应用中对于一个界面比如进入搜索界面或者修改信息等等情况,为了用户体验应该自动弹出软键盘而不是让用户主动点击输入框才弹出(因为用户进入该界面必然是为了更改信息).具体实现这种效果如下: [代码]java代码: 1 EditText editText.setFocusable(true); 2 editText.setFocusableInT

Android进入页面开始就自动弹出软键盘

EditText edittext = (EditText)findViewById(R.id.edittext);   edittext.setFocusable(true);   edittext.setFocusableInTouchMode(true);   edittext.requestFocus();   Timer timer = new Timer();   timer.schedule(new TimerTask() {                      public