加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

angularjs – 用textarea和键盘显示离子模态的正确方法

发布时间:2020-12-17 07:21:54 所属栏目:安全 来源:网络整理
导读:我有一个发送消息的模态,为了让键盘显示,我必须在触发模态后将焦点设置在textarea上. HTML script id="new-post.html" type="text/ng-template" div class="modal" form ng-submit="sendPost(post)" ion-header-bar class="bar-royal" button class="button
我有一个发送消息的模态,为了让键盘显示,我必须在触发模态后将焦点设置在textarea上.

HTML

<script id="new-post.html" type="text/ng-template">
  <div class="modal">
    <form ng-submit="sendPost(post)">
      <ion-header-bar class="bar-royal">
          <button class="button button-clear button-light" ng-click="closeNewPost()">Cancel</button>
          <h1 class="title">New Message</h1>
          <button type="submit" class="button button-clear">Post</button>          
      </ion-header-bar>
      <ion-content>

          <div class="list">
            <label class="item item-input">
              <textarea class="textareas" id="postMessageInput" ng-model="$parent.post.message" placeholder="What do you want to say?"  autofocus ></textarea>
            </label>
          </div>
      </ion-content>
    </form>
  </div>

控制器:

$ionicModal.fromTemplateUrl('new-post.html',function(modal) {
    $scope.postModal = modal;
},{
   scope: $scope,focusFirstInput: true
});
$scope.newPost = function() {
    $scope.postModal.show().then(document.getElementById('postMessageInput').focus());    
};

会发生的是模态首先向上滑动,然后键盘向上滑动.当模态首次显示时,屏幕有时闪烁.整个经历根本不顺利.有时,textarea甚至被推到模态标题下.

理想情况下,我希望模式使用已在视图上呈现的键盘向上滑动,就好像键盘嵌入到模态中一样.这就是其他应用程序(ios)的工作原理.这是可能的,还是有标准方法用键盘和textarea显示模态?

我通过将屏幕禁用设置为true来修复屏幕闪烁:
cordova.plugins.Keyboard.disableScroll(true)

Checkout Ionic Keyboard iOS Notes here

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读