`
lemo
  • 浏览: 91735 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

js多选

阅读更多
<script type="text/javascript">
			function actionEvent(methodname){
			var form = document.forms[0];
			if(validateIsSelect(form.all, form.productids)){
				form.action='';
				form.method.value=methodname;
				form.submit();
			}else{
				alert("请选择要操作的记录");
			}
		}
	
	/**
		多选
	*/
	function allselect(allobj,items){
	    var state = allobj.checked;
	    if(items.length){
	    	for(var i=0;i<items.length;i++){
	    		if(!items[i].disabled) items[i].checked=state;
	    	}
	    }else{
	    	if(!items[i].disabled) items.checked=state;
	    }
	}
	/*
	 * 判断是否选择了记录
     */
	function validateIsSelect(allobj,items){
	    var state = allobj.checked;
	    if(items.length){
	    	for(var i=0;i<items.length;i++){
	    		if(items[i].checked) return true;
	    	}
	    }else{
	    	if(items.checked) return true;
	    }
	    return false;
	}
	</script>	

.....
<td><INPUT TYPE="checkbox" NAME="newsid" value="${id }"/></td>
.....

<td>
					<INPUT TYPE="checkbox" NAME="all" onclick="javascript:allselect(this,this.form.newsid)"/>全选
				</td>


如果要多选并删除的话,要对删除按钮进行控制,在没选择任务记录时,删除按钮为灰色即不可用状态,选择记录后为可用,在js代码中加上如下:
//设置删除按钮是否可见
		function buttonDisable(){
	        var checkbox = document.getElementsByName("newsid");
	        for(var i=0;i<checkbox.length;i++){
	            if (checkbox[i].checked) {
	                document.getElementById("sub").disabled=false;
	                return;
	            }else{
	                document.getElementById("sub").disabled=true;
	            }
	                
	        }
	    }
	
		function allselect(allobj,items){
		    var state = allobj.checked;
		    if(items.length){
		    	for(var i=0;i<items.length;i++){
		    		if(!items[i].disabled)
		    		{
		    			items[i].checked=state
		    			if(items[i].checked){
		    				
			    		document.getElementById("sub").disabled=false;
			    		
		    			}
			    		else{
			    			 document.getElementById("sub").disabled=true;
			    		}
			    		
		    		} 
		    		
		    	}
		    }else{
		    	if(!items[i].disabled)
		    	{
			    	items.checked=state;
			    	
		    	} 
		    }
		}
分享到:
评论

相关推荐

    JS多选下拉框_实现多项选择

    JS多选下拉框,实现多选。点击显示下拉。 &lt;script type="text/javascript"&gt; &lt;!-- function $(e){return document.getElementById(e) ;} $('btnSelect').onclick = function () { //§ó§ï?? $('status')....

    js多选下拉列表

    总结一下,"js多选下拉列表"涉及的技术主要包括HTML的`&lt;select&gt;`元素与`multiple`属性、JavaScript/jQuery用于交互和增强用户体验,以及可能需要的jQuery插件如`select2`和`multi-select`。对于多级联动,需要理解...

    js多选下拉框多选下拉框多选下拉框

    JavaScript(简称js)作为客户端脚本语言,常被用来增强网页的交互性,其中包括实现多选下拉框的功能。本文将深入探讨如何使用JavaScript来创建和操作多选下拉框。 首先,HTML基础是构建多选下拉框的起点。一个基本...

    jquery.multiselect.js多选下拉框选择代码

    jQuery.multiselect.js是基于流行的JavaScript库jQuery构建的,它扩展了HTML `&lt;select&gt;` 元素的功能,使得多选下拉框具有更丰富的样式和交互性。这个插件允许用户通过简单的配置,实现分组、过滤、拖放排序等多种...

    JQ JS javascript 多选 多选下拉框 select bootstrap-select

    在网页开发中,多选下拉框是一种常见的用户交互元素,它允许用户在下拉菜单中选择多个选项。本主题将深入探讨如何使用JavaScript库,尤其是jQuery和Bootstrap,来实现这种功能。`bootstrap-select`是Bootstrap框架的...

    基于prototype的js多选下拉控件+源码+示例,可与后台直接取value

    在本教程中,我们将深入探讨一个基于Prototype库的JavaScript多选下拉控件,它允许用户进行多项选择,并能直接从后台获取value值。这个控件具有全选、自定义宽度和图标等高级功能,且附带了示例和注释,方便开发者...

    JQ JS javascript 日期多选控件

    本教程将深入探讨如何使用jQuery和JavaScript来创建一个日期多选控件。 一、日期选择器基础 在JavaScript中,我们经常使用内置的Date对象来处理日期。Date对象允许我们创建、格式化和比较日期。例如,创建一个新...

    js多选选框和单选框案例

    js多选选框和单选框案例

    JS多选下拉

    - `calendar.js` 可能是用来处理日期选择功能的JavaScript文件,与多选下拉框可能有关联,例如在日历事件中选择多个日期。 - `jsSelectBox.rar` 是一个压缩文件,里面可能包含了一个自定义的JS多选下拉组件,解压后...

    纯js实现多选下拉框并模糊查询.html

    纯JS控制实现多选拉下框并且带全模糊查询,不是首字母查询,打勾多选并带回隐藏值,非常实用!!

    js数据多选左右移动

    javascript效果,实现数据多选,可以左右移动

    js多级联动多选checkbox插件

    总的来说,理解和实现js多级联动多选checkbox插件涉及了JavaScript的多个核心概念,包括DOM操作、事件处理、数据结构、UI更新、性能优化以及模块化开发等。通过学习和实践,开发者可以创建出功能强大且易于使用的...

    js 多选下拉框 类似listbox

    ### JavaScript 实现两个多选下拉框数据交互 在网页开发中,经常需要用到两个多选下拉框(类似于 ListBox)来实现数据的选择与传递。这种交互方式常见于用户界面设计中,例如在“人员选择”场景中,允许用户将一个...

    jQuery多选JS

    本文将深入探讨jQuery在实现多选功能方面的应用,基于提供的"jQuery多选JS"源码,我们将讨论如何利用jQuery和JavaScript来创建高效、用户友好的多选功能。 首先,`check.js`可能包含了实现复选框(checkbox)多选...

    weui多选组件

    在使用WeUI多选组件时,开发者需要引入WeUI的CSS和JS库,然后创建相应的HTML结构。例如,可以使用`&lt;div class="weui-cells weui-cells_checkbox"&gt;`来定义一个多选列表,每个选项则用`...

    js实现的多选城市

    在这个场景中,"js实现的多选城市"是指使用JavaScript技术来创建一个功能,允许用户在选择多个城市时实现级联效果。级联城市通常指的是当用户在一个下拉框中选择一个特定的城市后,另一个下拉框会自动更新,显示与所...

    XM-select.js多选下拉框

    配合文章使用

    js 穿梭框,可以从左边到右边,也可以从右到左,支持多选

    综上所述,实现一个支持双向移动和多选的JavaScript穿梭框涉及HTML结构设计、CSS样式设置、JavaScript事件处理和数据管理等多个方面。这个过程需要扎实的前端基础知识,以及对用户体验的深入理解。通过不断实践和...

    js日历控件日期多选Kalendajs

    JavaScript(简称JS)是一种广泛用于客户端Web开发的脚本语言,它在网页中常用于处理用户的交互、操作DOM(文档对象模型)、以及实现各种动态效果。在这个场景中,"js日历控件日期多选Kalendajs" 提供了一种功能强大...

Global site tag (gtag.js) - Google Analytics