FireFox：在contentEditable div中，为什么选择元素无法获得焦点？
下面是我的代码。我的问题是 select 元素无法获得焦点，因此我无法使用它来选择选项。
<div id='editpanel' class="editpanel" contentEditable='true' >
<select>
<option value ='volvo'>Volvo</option>
<option value ='saab'>Saab</option>
<option value='opel'>Opel</option>
<option value='audi'>Audi</option>
</select>
</div>
我可以做什么来更改此选择元素以使其获得焦点？我已经尝试设置 tabindex=-1。如果我在选择元素上添加 contentEditable=false ，它会获得焦点，但无法删除。
其他元素如 set contentEditable ，它们仍然可以被删除，除了该元素。
在 Firefox 8 中测试。 我尝试了另一种方法，我在选择周围做了一个div，如下所示：
<div><select contentEditable='false'>...</select></div>
它可以设置焦点，并且可以删除，但是div对当前行进行了中断。
任何想法表示赞赏。
Below is my code. My problem is that the select element can't get focus, so I can't use it to select an option.
<div id='editpanel' class="editpanel" contentEditable='true' >
<select>
<option value ='volvo'>Volvo</option>
<option value ='saab'>Saab</option>
<option value='opel'>Opel</option>
<option value='audi'>Audi</option>
</select>
</div>
What can I do to change this select element so it gets focus? I already tried setting tabindex=-1. If I add contentEditable=false on the select element, it gets focus, but can't be deleted.
othere element like set contentEditable ,they still can be deleted,except the element.
Tested in Firefox 8.
I tried another way ,I make a div surround the selection like :
<div><select contentEditable='false'>...</select></div>
It can be set focus,and can be deleted,but the div made the a break of current row.
Any idea is appreciated.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
当 contentEditable div 中有诸如 [select] 之类的表单元素时，它将继承该设置，并且不允许用户与该元素交互。只需设置 [select contentEditable='false']，您就可以毫无问题地与下拉菜单进行交互。
When you have form elements such as [select] inside a contentEditable div, it will inherit the setting and will not allow user interaction with the element. Simply set [select contentEditable='false'] and you will be able to interact with the dropdown without a problem.