移动端dialog.js弹框中的input输入框不能输入

最新推荐文章于 2022-08-24 15:04:42 发布
最新推荐文章于 2022-08-24 15:04:42 发布
阅读量1.3k 收藏
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_30908729/article/details/90767492
版权

移动端dialog.js弹框中的input输入框不能输入

 

解决方法：

我在手机页面中使用dialog.js确认弹框中有input标签，但手指点击时不获取焦点，不能输入。

后来f12检查页面的标签，发现弹框中有一个标签的class属性的值是content-scroll，class属性设置content-scroll后，dialog.js就对这个标签绑定了一些事件影响了输入框聚焦。

我的方法是使用超级短的定时（至少要大于80）把这个content-scroll值去除。

js代码：http://www.yayihouse.com/yayishuwu/chapter/1959

码上敲享录
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
vue3 el-dialog中的input无法更新的问题
JeallyBean的博客
10-24 2071
vue3开发中的el-dialog中的input输入失效，无法更新
html页面input框输入不了,input框不能输入问题
weixin_30166291的博客
06-04 9349
input框不能输入问题今天在写程序设计登录页面的时候遇到了一个问题：输入框不能输入!就是我写着写着想测试一下功能，就发现输入框不能输入了。？？？还能出现这种问题？？就很疑惑，然后就搜了搜无法输入的原因。主要有如下情况：1. input框设置了readonly属性这个就很好理解了，readonly属性把input框设置成了只读，就不可以输入了eg:只读字段是不能修改的。不过，用户仍然可以使用 ta...
v-drag 可拖拽 div容器中含有input无法输入
F_mengze的博客
05-31 1285
继上篇文章 vue写一个可全屏拖拽容器效果之后，发现了：如果可拖动的div中有input输入框的话，不做处理input无法输入内容，所以我们需要在oDiv.onmousedown事件中加上以下代码，就可以解决input输入框无法输入的问题！ if(e.target.nodeName == 'INPUT'||e.target.nodeName == 'TEXTAREA'){ return } 如图： ...
elementUI中dialog踩坑(首次渲染问题)
热门推荐
smouns_的博客
11-24 1万+
elementUI中dialog踩坑(首次渲染问题)
el-input输入框无法输入问题
Giraffe0615的博客
08-24 1万+
el-input输入框无法输入问题
elementUi 新建和编辑dialog-input无法输入的小坑
weixin_41626938的博客
03-25 2445
<el-form-item :label="cateType === 1 ? '一级类目名称：' : '所属一级类目：'" prop="name" > <el-input v-model="deatilFrom.name" clearable maxlength="8" show-word-limit placeholder="请填写类目名称" :disabled="cateType === 2" /> </el.
html输入框无法输入,input输入框无法输入的Bug
weixin_34687748的博客
06-04 3267
bug的产生和修改上周临近周末休息的时候，一个同事跑过来了，对我说：“阿伦啊，有一个页面出问题了，火狐浏览器所有的input都没法输入了。”我一听，是不是你给加了什么属性，让input输入框只读了啊。看了一下代码，很正常的一个输入框，并且CSS写的也很正常。但是运行之后发现无法输入任何东西，包括字母、符号、数字(后来实验发现，输入了汉字之后可以输入符号和数字，这个暂时未发现原因)。那么问题就来了，...
jQuery.dialog.js网页弹出对话框美化特效插件
06-10
无论是在大型项目中作为基础组件，还是在小型应用中快速构建对话框，jQuery.dialog.js都能提供强大的支持，帮助开发者打造更具吸引力的网页应用。通过深入理解和灵活运用，开发者可以充分利用这个插件，提升网页的...
css 弹框dialog.js
05-28
弹框dialog.js
dialog.js 前端JavaScript，简易的弹窗插件
07-20
dialog.js 前端JavaScript，简易的弹窗插件 用于弹出自定义的弹窗，内部对于常见的滚动穿透，输入法遮挡输入框都有相应的处理。 精简小巧，压缩后仅有5k.
jquery.dialog.js 经典弹出框附案例代码
09-30
`jQuery.dialog.js`是基于jQuery库的一个经典弹出框插件，它为网页开发者提供了方便、灵活的对话框功能。这个插件使得在网页中创建模态或非模态的对话框变得轻而易举，无需复杂的HTML和CSS布局，大大简化了前端交互...
jquery.dialogBox.js插件下载特效代码
03-20
jQuery.dialogBox.js的核心特性在于其多样性，提供了9种不同的对话框类型，包括但不限于警告、信息、确认、输入等常见模式，这极大地丰富了开发者在创建用户界面时的选择。对于初学者来说，通过这款插件可以快速理解...
解决el-dialog使用时无法正常弹出的问题
weixin_43550562的博客
04-24 5767
在使用el-dialog,发现无论怎么做,该对话框也无法显示,前端也没有报错. 点击按钮时,发现遮罩层已经出来了,但对话框没有显示. 经查,缺少属性append-to-body,将该值设置为true即可 <!--审批悬浮框--> <el-dialog class="el-dialog__width" ...
dialog无法打开
weixin_55229531的博客
05-20 1万+
dialog无法打开
Ant Design 中 input 无法输入的问题
ErikChan的博客
02-21 7848
Ant Design 是阿里巴巴开发的一套企业级 UI 设计语言和 React 组件库， 极大地提高了前端开发人员的开发效率。 在我的开发过程中，使用过 ant design 中的 input 组件，遇到了 input 框无法输入的问题。 错误示例 <input className='input_obj' onChange={} value="test"> </input> 在浏览器中打开，在 input 框中输入数据时, 发现内容一致都不变，内容都为 test， 如同被禁止修改
好用js的弹框插件 dialog
weixin_43617604的博客
07-11 1205
dialog 弹框插件 代码示例 注 : 只需要引入css js即可 http://www.17sucai.com/preview/367454/2018-06-27/A24TG4TWRF/dist/mDialogMin.js http://www.17sucai.com/preview/367454/2018-06-27/A24TG4TWRF/dist/dialog.css <!...
统计预测与决策课程实验
最新发布
07-06
内含实验与完整程序
com.kongzue.dialog.v3.CustomDialog在fragment里面写弹框
05-24
在 Fragment 中使用 CustomDialog 弹框，可以按照以下步骤进行： 1. 在 Fragment 中创建 CustomDialog 对象。 ``` CustomDialog dialog = new CustomDialog(getContext()); ``` 2. 设置 CustomDialog 的样式和内容。 ``` dialog.setContentView(R.layout.dialog_layout); dialog.setFullScreen(true); dialog.setTitle("标题"); dialog.setMessage("内容"); ``` 3. 设置 CustomDialog 的按钮及其点击事件。 ``` dialog.setPositiveButton("确定", new View.OnClickListener() { @Override public void onClick(View v) { // 点击确定按钮的操作 dialog.doDismiss(); } }); dialog.setNegativeButton("取消", new View.OnClickListener() { @Override public void onClick(View v) { // 点击取消按钮的操作 dialog.doDismiss(); } }); ``` 4. 显示 CustomDialog。 ``` dialog.show(); ``` 完整代码示例： ``` CustomDialog dialog = new CustomDialog(getContext()); dialog.setContentView(R.layout.dialog_layout); dialog.setFullScreen(true); dialog.setTitle("标题"); dialog.setMessage("内容"); dialog.setPositiveButton("确定", new View.OnClickListener() { @Override public void onClick(View v) { // 点击确定按钮的操作 dialog.doDismiss(); } }); dialog.setNegativeButton("取消", new View.OnClickListener() { @Override public void onClick(View v) { // 点击取消按钮的操作 dialog.doDismiss(); } }); dialog.show(); ```

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值