select多选  multiple的使用

<html>
<head>
<script type="text/javascript">
function showDiv(id){ document.getElementById("selectOption").style.display="block";
document.getElementById("selectOption").style.position="absolute";
document.getElementById("selectOption").style.top=document.getElementById(id).offsetTop+25;
document.getElementById("selectOption").style.left=document.getElementById(id).offsetLeft+20;
}
function selectM()
{
var obj = document.getElementById("mySelect");
alert(obj.selectedIndex); }
function checkselect(objname){
o = document.getElementById(objname);
t = document.getElementById("output");
var intvalue="";
for(i=0;i<o.length;i++){
if(o.options[i].selected){
intvalue+=o.options[i].value+",";
}
}
t.value=intvalue.substr(0,intvalue.length-1);
alert(intvalue); } </script>
</head>
<body> <form>
<div id="selectOption" style='width:100px;height:50px;z-index:100;border:1px solid #0099FF;background:#cccccc;display:none;'>
<select id="mySelect" multiple="multiple" size="4">
<option value='苹果'>苹果</option>
<option value='桃子'>桃子</option>
<option value='香蕉'>香蕉</option>
<option value='桔子'>桔子</option>
</select>
<input type="button" onclick="checkselect('mySelect')" value="checkselect">
</div>
选中的项目:<input type="text" name="output">
<input id="lalla" type="button" onclick="showDiv(this.id)" value="选择">
<br/> </form>
<p>在您点击 “选择多个” 按钮之前,请尝试同一时候选取多个选项。在点击 “选择多个” 按钮之后,请再试一次。</p> </form>
</body>
</html>

select多选 multiple的使用的更多相关文章

  1. 目录窗口多选Multiple Select in Catalog Window or arccatalog

    目录窗口多选Multiple Select in Catalog Window or arccatalog 商务合作,科技咨询,版权转让:向日葵,135-4855__4328,xiexiaokui#q ...

  2. 工作需求----表单select多选交互

    由于工作需求接触select框多选的情况,以下是我分享的代码,主要是进入页面默认选中.支持多选属性: 1.html内容 multiple=”multiple” 属性为多选属性 <div clas ...

  3. JS 获取select(多选下拉)中所选值的示例代码

    通过js获取select(多选下拉)中所选值,具体实现如下,有需要的朋友可以参考下,希望对大家有所帮助 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML ...

  4. 前端jquery 获取select多选的值

    当select设置属性multiple='multiple'时, option就可以多选了  那么我们如何获取所有被选中的option的值呢? 首先说明: $('select[name="m ...

  5. select多选框

    select多选框 效果: 代码: <HTML> <HEAD> <TITLE>选择下拉菜单</TITLE> <meta http-equiv=&q ...

  6. vue结合element-ui 的select 全选问题

    下拉列表多选 问题 通过操作 所有来进行全选 全不选问题 element-ui 中 select 记录下自己最近使用element-ui 中的 select多选问题 在element中默认是指单纯多选 ...

  7. select多选

    1.css <style> .divBox{ width:400px; margin:100px auto; } .divBox span{ vertical-align:top; dis ...

  8. select2多选设置select多选,select2取值和赋值

    select2设置select多选,select2取值和赋值,作为筛选条件的时候,取值相对简单,把选中的id值转为字符串传给后端查询,查询之后会刷新页面,为了在下拉框中显示刚刚选中的值,就需要给sel ...

  9. Bootstrap select多选下拉框实现代码

    前言 项目中要实现多选,就想到用插件,选择了bootstrap-select. 附上官网api链接,http://silviomoreto.github.io/bootstrap-select/. 没 ...

随机推荐

  1. RabbitMQ学习总结(3)——入门实例教程详解

    一.起航 本章节,柯南君将从几个层面,用官网例子讲解一下RabbitMQ的实操经典程序案例,让大家重新回到经典"Hello world!"(The simplest thing t ...

  2. 代理模式之cglib动态代理

    上一篇博客说了实现InvocationHandler接口的jdk动态代理,还有一种实现动态代理的方式则是:通过继承的方式实现的cglib动态代理. 先在程序中导入cglib的包,cglib-nodep ...

  3. shell文本过滤编程(一):grep和正則表達式

    [版权声明:转载请保留出处:blog.csdn.net/gentleliu.Mail:shallnew at 163 dot com] Linux系统中有非常多文件,比方配置文件.日志文件.用户文件等 ...

  4. 配置 Phpstorm + Xdebug + xampp

    配置 Phpstorm + Xdebug + xampp 1 Xampp 安装好xampp,配置 httpd.conf 在xampp面板中 单击后会出现一些配置文件,httpd.conf位于第一个 将 ...

  5. Android 开发之集成百度地图的定位与地图展示

    app 应用中,大多数应用都具有定位功能,百度定位就成了开发人员的集成定位功能的首选,近期也在做定位功能,可是发现百度真是个大坑啊, sdk 命名更新了,相关代码却不更新,害得我花费了非常长时间来研究 ...

  6. android选择图片或拍照图片上传到server(包含上传參数)

    在9ria论坛看到的.还没測试,先Mark与大家分享一下. 近期要搞一个项目,须要上传相冊和拍照的图片.不负所望,最终完毕了! 只是须要说明一下,事实上网上非常多教程拍照的图片.都是缩略图不是非常清晰 ...

  7. s3c2440的IIC控制

    在tq2440和mini2440上都连接着EEPROM 它们作用也不过測试I2C总线能否用. 当中在mini2440上EEPROM型号是 AT24C08,在tq2440上这个型号是 AT24C02A. ...

  8. awk双文件互相匹配查找

    awk双文件互相匹配查找 要求: 文件a:  10/05766798607,11/20050325191329,29/0.1,14/05766798607  10/05767158557,11/200 ...

  9. php和js区别

    php和js区别 两者在语法上类似,楼上说的对,js=javascript是工作在浏览器端的脚本语言,他所提交的数据是交给浏览器来处理的.但是现在的Ajax技术已经可以把js提交的数据交付到浏览器来处 ...

  10. xBIM 基础05 3D墙案例

    系列目录    [已更新最新开发文章,点击查看详细]  使用编码的形式去生成一堵墙的模型需要做很多的工作. using System; using System.Collections.Generic ...