• js监听屏幕的高度变化


    之前用VUE写完一个聊天界面,对于ios的效果该优化的地方都已经优化,且已上线。现在因项目需要,在另外一个angularjs+ionic的框架也要写一个聊天页面,目前还在开发中,发现忘记了一些很关键的东西,所以先备个份:

    1.当屏幕发生高度变化(其实是当软键盘打开的时候,窗口的高度发生了变化)

    window.onresize = () =>{

      //只要窗口高度发生变化,就会进入这里面,在这里就可以写,回到聊天最底部的逻辑

    }

    2.vue的写法,把上面的方法写在了mounted里面,然后return 窗口可视范围的高度并存在变量里面,然后watch里面去监听这个变量,变量变化>>>回到底部:滚动容器.scrollTop = 滚动容器.scrollHeight;

    3.对于angularjs+ionic是以下方法(打开软键盘,窗口变化,滚动到底部):

    window.onresize = function(){

      $scope.$apply(function(){

        $ionicScrollDelegate.resize();

        $ionicScrollDelegate.scrollBottom();

      })

    }

    4.对于很多疑问关于软键盘发送信息之后,软键盘关闭。需求想要的效果是发送信息之后,软键盘不会自动收起来。我的做法是用label,在发送按钮用label标签。如下(vue):

    <input id="modalText" type="text" v-model="chartMsg">

    <label for="modalText" @click="sendMsg">发送</label>

    以上,angularjs也是类似这样的写法(运用label标签for和input绑定)。

  • 相关阅读:
    【POJ】3243 Clever Y
    【BZOJ】3916: [Baltic2014]friends
    【URAL】1960. Palindromes and Super Abilities
    【BZOJ】3621: 我想那还真是令人高兴啊
    【BZOJ】2286: [Sdoi2011消耗战
    【POJ】2891 Strange Way to Express Integers
    鬼畜的多项式
    【CF】438E. The Child and Binary Tree
    【BZOJ】3456: 城市规划
    【POJ】1811 Prime Test
  • 原文地址:https://www.cnblogs.com/start-ming/p/12022843.html
Copyright © 2020-2023  润新知