`

select 多选

阅读更多
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>select 多选</title>
<script language="javascript">
  <!--
   function show(){
     var sel = document.forms["form1"].s1;
     var s = "";
     for(var i=0;i<sel.options.length;i++){
        if(sel.options[i].selected)
          s += sel.options[i].innerText + ",";
     }
     if(s!="") s = s.substr(0,s.length-1);
       alert(s);
    }
   -->
</script>
</head>
<body>
<form name="form1" id="form1">
<div width="300" height="160" border="1">
<select   name= "s1"   style= "WIDTH:   100px "  multiple="multiple"   size=15  id="list"  >
    <option>XHTML</option>
            <option>CSS</option>
            <option>JAVASCRIPT</option>
            <option>XML</option>
            <option>PHP</option>
            <option>C#</option>

            <option>JAVASCRIPT</option>
            <option>XML</option>
            <option>PHP</option>
            <option>C#</option>

            <option>JAVASCRIPT</option>
            <option>XML</option>
            <option>PHP</option>
            <option>C#</option>

            <option>JAVASCRIPT</option>
            <option>XML</option>
            <option>PHP</option>
            <option>C#</option>
            <option>JAVA</option>
            <option>C++</option>
            <option>PERL</option>
    </select>
    </div>
<input name="button" type="button" onclick="show()" value="ShowOptionText"  />
</form>
</body>
</html>
分享到:
评论

相关推荐

    select多选下拉列表+模糊查询功能.rar

    select多选下拉列表+模糊查询功能,亲测完整,有ASP和HTML样例,代码完整。 &lt;!DOCTYPE html&gt; &lt;title&gt;Insert title here&lt;/title&gt; &lt;script src="jquery.min.js"&gt;&lt;/script&gt; ...

    select多选下拉框美化

    总之,"select多选下拉框美化"是一个涉及前端多个领域的任务,需要结合jQuery的动态操作和CSS的样式定制,通过创新的布局和交互设计,为用户提供更优质的使用体验。在实际应用中,开发者还需要根据项目需求和用户...

    下拉框多选select多选

    在网页设计和开发中,"下拉框多选select多选"是一个常见的功能,它允许用户在下拉菜单中选择多个选项,而不仅仅是一个。在HTML中,`&lt;select&gt;`元素通常用于创建这样的下拉菜单,但默认情况下,`&lt;select&gt;`只支持单选。...

    select多选与美化

    "select多选与美化"这个主题关注的是如何在HTML的下拉列表中实现多选功能,并且兼容各种主流浏览器,包括Firefox、Opera、Chrome、Safari以及IE6到IE9。这通常涉及到JavaScript库,特别是jQuery的使用,以及CSS样式...

    vue-select 多选下拉列表

    vue-select 多选下拉列表,建议用火狐或者谷歌浏览器打开,低版本IE对vue兼容性不好

    div 模拟 select 多选

    div 模拟 select 多选 实现还有点bug,望大家一起改正。

    基于layui的select多选解决方案

    在layui的基础上,把select选择框可更改为多选框,并可进行搜索、筛选值。下拉框内容可物理分页配置、自定义搜索模式(远程搜索)。 存在layui时, 同样也能直接使用xmSelect, 不用必须layui.xmSelect 具有多选上限设置...

    element ui select多选组件 重构

    在本项目中,我们关注的是 "select" 多选组件的重构,它是一个用于用户从多个选项中选择的交互元素。在 Element UI 中,`el-select` 组件支持单选和多选模式,并允许自定义样式和行为。 重构通常涉及到改进代码结构...

    jquery+css+div 实现的模拟select多选

    jquery+css+div 实现的模拟select多选 jquery+css+div 实现的模拟select多选

    原生select实现多选功能

    原生select实现多选功能

    Select多选

    其中,“Select多选”插件——layui-select-ext,就是针对下拉选择框的多选功能进行优化和增强的一个杰出实例。 layui-select-ext的核心功能在于提供了一个可多选的下拉框,使得用户在选择数据时不再局限于单个选项...

    Select多选.rar

    在提到"Select多选"时,我们通常是在讨论如何在HTML的选择框(`&lt;select&gt;`元素)中实现多选功能。在传统的HTML中,`&lt;select&gt;`元素默认只支持单选,但通过JQuery和一些额外的插件或技巧,我们可以使用户能够选择多个...

    实现select多选插件

    在本文中,我们将深入探讨如何实现一个`select`多选插件。`select`元素是HTML中的一个基础组件,用于创建下拉菜单供用户选择。然而,原生的`select`元素并不支持多选功能,这使得在需要用户可以选择多个选项的场景下...

    用javascript实现不按Ctrl实现Multiple Select多选

    ### 使用JavaScript实现不按Ctrl键实现Multiple Select多选 在Web开发中,有时我们需要让用户能够更方便地选择多个选项而不必使用键盘上的Ctrl键。这种功能可以提高用户体验,并且适用于那些希望快速完成任务的用户...

    表头搜索组件包括说明书(无树形组件与select多选)

    无树形组件意味着这个搜索功能不包含对嵌套或层级结构数据的支持,而“无select多选”则表示在选择条件时,用户可能只能单选,无法进行多项选择。 描述中提到“源码带说明书”,意味着提供了完整的源代码和相关的...

    html多选下拉框 ,CheckBox的Select组件 可多选的下拉框

    在HTML中,创建一个可多选的下拉框通常涉及到`&lt;select&gt;`元素与`&lt;option&gt;`元素的组合,但为了实现多选功能,我们需要使用`&lt;input type="checkbox"&gt;`和自定义的JavaScript或者利用现代浏览器支持的Web组件技术。...

    layui多选下拉框样式,整套layui-select-multiple

    "layui-select-multiple"就是Layui专门为多选下拉框设计的一整套样式和功能。 首先,我们来看“layui多选下拉框样式”这一知识点。Layui的多选下拉框在视觉上非常整洁,其设计遵循了扁平化和简洁化的理念,与现代...

    select 实现多选

    当我们希望实现多选功能时,就需要利用`&lt;select&gt;`的一些特定属性和方法。本篇文章将深入探讨如何在HTML、CSS以及JavaScript中实现`&lt;select&gt;`的多选特性。 ### HTML基础 在HTML中,`&lt;select&gt;`元素有一个名为`...

    jsp select 带多选框

    文件名`t.jpg`可能是相关示例的截图,`multi_select`可能是一个包含更多复杂逻辑或定制样式的多选下拉框的示例文件,可能是CSS样式表或者JavaScript脚本。 总之,"jsp select 带多选框"是JSP开发中常见的用户输入...

    select模拟多选下拉

    在网页开发中,"select模拟多选下拉"是一个常见的需求,特别是在需要用户选择多个选项时。传统的HTML `&lt;select&gt;` 元素虽然支持`multiple`属性实现多选,但其样式和交互方式往往不能满足现代网页设计的需求。因此,...

Global site tag (gtag.js) - Google Analytics