jQuery UI对话和Textarea焦点问题

Question

我正在使用jQuery和jQuery UI开发模态注释系统,但我有一些焦点问题.我在模态中有一系列div来在Login和Add注释之间切换,如下所示:

<div id="modal" title="Loading">
 <div id="modalContent"></div>

 <div id="modalLogin">
  <div class="loginBox"></div>
  <div class="addCommentBox"></div>
  <div class="commentReview"></div>
 </div>
</div>

在addCommentBox div里面,我有评论代码:

 <form action="/comments/add" class="addCommentForm" name="addCommentForm" method="post">
  <textarea name="content" class="addCommentContent"></textarea>
  <button value="Add Comment" type="submit" class="commentPost"/>
  <button value="Clear Comment" type="submit" id="clearComment"/>
 </form>

问题是打开对话框后大约一半的时间,addCommentBoxdiv中的textarea在选择时不会对键盘输入作出反应.鼠标正常工作,将允许选择文本,但键盘控制不执行任何操作.

我在textarea上没有事件监听器.我在按钮上有一些,但它们只针对按钮.

HTML中唯一发生的事情似乎是每次点击模态时,z-index会增加整个模态div.我设置addCommentBoxdiv的z-index为9999,大于模态的z-index.

任何建议或研究方向将不胜感激.谢谢!

Answer 1

如果“一半时间”发生这种情况，那就很难了。在其他一些浏览器上测试一下，看看是否会出现同样的情况。