如何防止屏幕上显示多个html选择框？

Question

我一直在研究基于php + ajax的数据网格项目的最后一点。除了一件事之外，一切都像我设计的那样：我无法阻止用户打开多个选择框......

  

转到my research page并使用用户名“ChenxiMao”和密码“accedo”登录（不带双引号）。

请注意，第一次加载页面时，可能不会显示此数据网格中使用的图像（很奇怪，我试图修复此问题，也许是浏览器不兼容）。

如果双击“顾问”列中的一个单元格，将显示一个html选择框，您可以选择一个顾问将其分配给此任务或从该任务取消分配顾问。没问题。

问题是：当用户离开此选择框时，他/她仍然可以打开另一个选择框...我的jquery代码无法阻止人们打开多个选择框。

您可以使用ctrl-U查看此页面上的源代码，并检查“gridview-helper.js”中的内容以了解我的所作所为。

我想让用户只打开一个选择框。当他/她离开单元格时，应该关闭选择框，而不更改内部的html ...

困惑，今天下午搞砸了......

提前感谢任何建议！

Answer 1

JavaScript是单线程的，因此您可以在打开新的选择框之前添加互斥变量并检查其值。

位于gridview-helper.js的顶部：

var is_choice_visible = false;

在双击处理程序中：

$(this).dblclick(function()
{
    if (is_choice_visible)
        return;
    is_choice_visible = true;
...

对于您的选择框，添加onblur处理程序，将is_choice_visible设置回false并删除自身。

不相关的提示：在旧版本的Internet Explorer中，在循环中增加字符串的速度很慢。附加到数组并加入数组效率更高，例如：

var html = ["<select>..."];
for (var i in consultantnames)
{
    html.push("<option>...</option>");
}
html.push("</select>");
return html.join("");

Answer 2

您是否尝试在单元格上使用onmouseout事件，并在触发鼠标输出时删除子下拉框元素？似乎应该有用。