在开发对话框的时候使用jQuery类库来打开对话框,第一次可以输入,第二次不管怎么点击,怎么输入按键盘都无法输入。很是纳闷,纠结了很久,我一直我以为我写的代码有些问题,是不是在哪里监听了click事件。

另外还发现第二次除了无法输入文字,连F12都被捕获了,无法打开Chrome的开发者工具,F1也被捕获,但是ESC没有被捕获可以使用。

初步怀疑jQuery的类库做了什么事情,让我一直没办法点击。

后来分析z-index发现,我对话框自定义的内容z-index的值小于外层容器的值。但是只是傻傻的将input的z-index的值增加,但是并没有效果。后来不小心对我自定义对话框内容的z-index增大了一些,发现真的可以输入了。好欢喜。

这里对话框的z-index值大于遮罩层的z-index时才能点击,否者只能看见遮罩层而无法点击。

没有时间去探究为什么内层的dom没有设置z-index,外层有z-index,但是内层却不能获得焦点。很是困惑。可能哪里遗漏的吧。

声明:未经允许禁止转载 东东东 陈煜东的博客 文章,谢谢。如经授权,转载请注明: 转载自东东东 陈煜东的博客

本文链接地址: jquery对话框弹出层无法点击输入 – https://www.chenyudong.com/archives/jquery-dialog-do-not-input-and-click.html