uniapp中点击输入框禁止input获取焦点

场景：输入框与发送按钮是兄弟关系。输入框获取焦点时会唤起键盘，点击发送的输入框会失去焦点。

要求：点击发送按钮时，输入框不能失去焦点，键盘一直呈现唤出状态

分析：

当我们点击某一个元素时，这个元素就会默认获取焦点，在上述场景中，输入框在获取焦点时会唤出键盘，但是由于发送按钮与输入框不是同一个Dom元素，所以点击发送按钮时输入框就会失去焦点，发送按钮就会回去焦点，键盘就是收起。

如果阻止点击Dom元素的默认获得焦点这个事情，那么上一个获取焦点的Dom元素就不会失去焦点。也就是输入框不会失去焦点，键盘就不会收起

*** 作：发送按钮的事件用@touchendprevent=“ ”

touchend（触屏事件） prevent（阻止默认事件）

例子：

<view class="send" :class="sendMsgClass" @touchendprevent="sendText">

<view class="btn">发送</view>

</view>

如果分析的不对，请指教

就是小程序上方由胶囊占据的bar，就叫titleBar。

因为我们可以在胶囊左侧写标题和其他一些东西。这些东西要跟胶囊中线对齐。

首先我们要撑起statusBar的高度，也就是最顶部的那个bar。这个bar的高度很容易取得。

unigetMenuButtonBoundingClientRect()top取得的是胶囊距离视口顶部的距离，减掉statusBar的高度，就是胶囊离statusBar下沿的距离。这个距离乘以2，加上胶囊自身高度，就是titleBar的高度。

见红色部分。

开发者工具中会有略微错位，无妨，以真机为准。

我们希望胶囊左侧空白区域与胶囊有间距，而且间距最好是等于胶囊到右边边线的距离。这个前提下，左侧空白区域的宽度怎么算？

写成组件就是这样：

用法：

演示如何使用作用域插槽：

以上就是关于uniapp中点击输入框禁止input获取焦点全部的内容，包括:uniapp中点击输入框禁止input获取焦点、uniapp小程序获取titleBar的高度和宽度、等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！