6

我有一个多选 SELECT 字段，我不希望最终用户能够更改其值。

出于 UI 原因，我希望能够在不使用 disabled="true" 属性的情况下执行此操作。我尝试使用 onmousedown、onfocus、onclick 并将每个设置为模糊或返回 false，但没有成功。

这可以做到还是我试图做不可能的事情？

4

6 回答 6

9

我知道您提到您不想这样做，但我实际上认为使用该disabled属性是一个更好的解决方案：

<select multiple="multiple">
    <option value="volvo" selected="true" disabled="disabled">Volvo</option>
    <option value="saab" disabled="disabled">Saab</option>
    <option value="opel" disabled="disabled">Opel</option>
    <option value="audi" disabled="disabled">Audi</option>
</select>

如有必要，您始终可以提供selectaclass并使用 CSS 对其进行样式设置。无论脚本功能如何，此解决方案都适用于所有浏览器。

于 2008-09-04T14:56:08.287 回答
2

你能用一个onchange事件来做吗？

<select onfocus="this.oldIndex=this.selectedIndex" onchange="this.selectedIndex=this.oldIndex">
于 2008-09-04T14:31:45.380 回答
2

您最好的选择是交换选择框中的选项。如果您在该框中只有一个答案，那么它是否可点击并不重要。

但是，我会尝试找到另一种方法来执行此操作，因为这似乎会给用户带来挫败感。想象一下这个用户场景：

  1. “看，一个选项框。”
  2. 点击
  3. “嗯，怎么没用？”
  4. 点击
  5. 点击！
  6. “这蠢东西坏了，我再也不回来了。”

如果您将 select 替换为 HTML 文本，它可以实现相同的目标。对于大多数主要的 Javascript 框架来说，这是一个相当简单的任务。

于 2008-09-04T14:36:44.760 回答
0

@Jack & @17 of 26，好点，但最终用户会期望选择框被禁用，这样混淆就不应该成为问题。

我应该更清楚为什么我不能禁用控件。

将使用它的应用程序将需要禁用选项的选择，并且要求“锁定”控件仍保持正常表单控件的外观和感觉。

于 2008-09-04T15:03:33.960 回答
0

试试这个触发器。

<select multiple onchange="this.selectedIndex=this.selectedIndex">
<option>1</option>
<option>2</option>
</select>
于 2013-02-07T10:10:18.003 回答
0

CSS3 最近新增了一个与除 Opera Mini 之外的所有当前浏览器95% 兼容pointer-events的新功能，称为. 简而言之，您可以“禁用”一个SELECT或任何其他元素上的默认操作，并且仍然能够对其执行特定事件......

您可以在此处输入链接描述查看 Chris Coyier 的文章。

这是否更接近您要查找的内容...抱歉，我无法提供自己的任何编码示例...

于 2018-03-14T22:27:35.793 回答