`

select 标签 禁止选择

    博客分类:
  • JS
 
阅读更多

禁止select标签选择

大家知道, 对于HTML控件select, 是没有readOnly属性的,
所以设置它并不起作用,如:

<select id="select1" readonly="readonly">
<option value="aa">aa</option>
<option value="bb">bb</option>
<option value="cc">cc</option>
<option value="dd">dd</option>
</select>

 如果用disabled的话,提交时又取不到值.

那有什么方法可以实现?
----我现在还没找到 -_-!
不过可以有一个折中的方法,如下:

<select id="select1" readonly="readonly" onfocus="this.defOpt=this.selectedIndex" onchange="this.selectedIndex=this.defOpt;">
<option value="aa">aa</option>
<option value="bb">bb</option>
<option value="cc">cc</option>
<option value="dd">dd</option>
</select>

 這样就搞定了

分享到:
评论

相关推荐

    html option禁用选择 select禁用选项示例

    `&lt;optgroup&gt;`元素用于创建一个有标签的选项组,用户无法选择整个组。虽然这不会完全禁用选项,但它可以达到不让用户看到和选择这些选项的效果。例如: ```html &lt;select&gt; &lt;option value=""&gt;1 &lt;option value=""&gt;2 ...

    解决element-ui里的下拉多选框 el-select 时,默认值不可删除问题

    el-select组件允许用户在一个下拉列表中选择一个或多个选项。在多选模式下,用户可以通过点击“x”图标来移除已经选中的标签(tag)。然而,在某些业务场景下,我们可能需要设置一些默认选项,而这些默认选项是不...

    css禁止html标签被选中的方法

    以下CSS样式实现了各浏览器的标签禁止选中功能。 复制代码代码如下:moz-user-select: -moz-none;-moz-user-select: none;-o-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:...

    div+js+css模拟select并且把无效的select选项设置为灰色不可用

    总的来说,模拟`select`是一种提高用户体验的策略,它允许开发者跳出原生HTML标签的限制,创造出更符合设计需求的组件。而将无效选项设为灰色不可用,则进一步增强了交互的清晰度,帮助用户理解哪些选择是不可行的。

    typeselect

    在Android开发中,"typeselect"这一主题通常指的是创建一个具有滚动视图(ScrollView)嵌套RecyclerView的交互式布局,这种设计模式常用于实现类似熊猫直播频道选择的功能。在这种场景下,用户可以通过上下滑动主...

    jquery 实现两Select 标签项互调示例代码

    标题中的“jquery 实现两Select 标签项互调示例代码”指的是使用jQuery库来实现两个多选下拉框(Select元素)之间的选项互相移动的功能。这种功能常见于需要用户在两个列表之间选择和分配项目的场景,例如,将已选...

    js 禁止选择功能实现代码(兼容IE/Firefox)

    禁止选择示例 ;"&gt; 这段文本无法被选择。 ``` 在上述代码中,`&lt;body&gt;`标签的`onselectstart`属性设置为`return false`,当用户尝试选择页面文本时,浏览器会执行这个函数并阻止默认的文本选择行为。 然而,...

    网页禁止复制实现

    `*`表示选择所有元素,`user-select: none;`则是禁止这些元素被选中。 3. **禁止拖放**: 拖放操作也是一种可能的复制方式,可以使用JavaScript阻止: ```javascript document.body.addEventListener('...

    vue实现页面内容禁止选中功能,仅输入框和文本域可选

    CSS样式控制,只需将下面代码复制到 vue应用下,index.html文件中的body标签上 *{ -webkit-touch-callout:none; /*系统默认菜单被禁用*/ -webkit-user-select:none; /*webkit浏览器*/ -khtml-user-select:none; ...

    IOS中safari下的select下拉菜单文字过长不换行的解决方法

    `&lt;select&gt;`标签是HTML中用来创建下拉列表的元素,用户可以从一系列预设的选项中进行选择。然而,不同的浏览器可能对`&lt;select&gt;`的渲染方式有所差异,尤其是在移动端的Safari中,对于长文字的处理方式可能会导致显示...

    禁止右键代码示例demo

    - 禁止除表单元素(如输入框、文本区域等)之外的所有元素的文字选择。 - 通过监听`onmousedown`和`onmouseup`事件来控制文本选择行为。 #### 三、总结与思考 虽然禁止右键点击可以在一定程度上保护网站内容或优化...

    解决option标签selected=”selected”属性失效的问题

    在`&lt;select&gt;`标签上添加`autocomplete="off"`,可以禁止浏览器对这个特定的下拉列表进行自动完成。这样,无论用户之前选择了哪个选项,页面刷新后,`selected="selected"`属性都将生效,确保预设的选项被正确选中。 ...

    js鼠标移动时禁止选中文字

    总的来说,禁止用户通过鼠标选择文字是通过CSS样式来实现的,特别是使用`user-select`属性。同时,我们可以通过JavaScript监听和处理鼠标事件,以在特定情况下动态控制文本选择的行为。然而,应当谨慎使用这样的功能...

    利用CSS实现禁止双击选择页面内容的实例展示

    标题中的“利用CSS实现禁止双击选择页面内容的实例展示”指的是通过CSS样式来阻止用户在网页上双击选中特定区域的文本内容。这种方法在处理网页交互时特别有用,例如,当用户双击左右箭头快速切换图片滚动时,避免...

    详解Html页面中内容禁止选择、复制、右键的实现方法

    首先,要禁止用户选择网页上的文本,可以在标签中添加onselectstart="return false"属性。这个属性通过阻止选择事件的默认行为,从而禁止用户拖动鼠标来选择文本。 其次,禁止复制文本是一个常见的需求。要实现这个...

    js禁止document element对象选中文本实现代码.docx

    - **`document.getElementsByTagName(tagname)`**:获取指定标签名的所有元素。 - **`document.createElement(element)`**:创建一个新的HTML元素。 - **`document.write(text)`**:向文档写入文本或HTML代码。 - **...

    HTML常用标签整理

    - `&lt;select&gt;` 创建下拉列表,`&lt;option&gt;` 为选项。 - `&lt;textarea&gt;` 创建多行文本输入框。 - `&lt;input&gt;` 可以有多种类型,如`type="checkbox"`创建复选框,`type="radio"` 创建单选按钮,`type="text"` 创建文本...

Global site tag (gtag.js) - Google Analytics