用鼠标拖拉来选中checkbox
(function($){/*-----------------------------/功能:用鼠标拖拉来选中checkbox参数:无返回:原调用对象示例:$('#testtable').squareSelection();author: hushuilongemail: hushuilong@gmail.com/-----------------------------*/$.fn.squareSelection=function(){var container = $(this);var stop_pop = function(e) {try {e.stopPropagation();} catch(err) {window.event.cancelBubble = true;}};var box = function(){if($('#square_selection_box').length == 0){$('<div></div>',{id:'square_selection_box', style: ['position:absolute; top:0; left:0;','border:1px solid #072246; background: #6bb0c9;','filter:Alpha(Opacity=15); opacity:0.15;','overflow:hidden;display:none;z-index:99999;'].join('')}).appendTo(document.body);}return $('#square_selection_box');};var init = function(){document.oncontextmenu=function(){ return false; }; $(container).find(':checkbox').mousedown(function(e){stop_pop(e);});// mouse up$(document).bind('mouseup', function(event){$(container)[0].setCapture && $(container)[0].releaseCapture();if(box().css('display') != 'none') {var box_offset_top = box().offset().top;var box_offset_bottom = box().offset().top + box().height();$(container).find(':checkbox').each(function(i,item){var offset_top = $(item).offset().top;var offset_bottom = $(item).offset().top + $(item).height();if (offset_bottom >= box_offset_top && offset_top <= box_offset_bottom) {$(item).attr('checked',true);}});}box().hide();$(container).unbind('mousemove');});// mouse down$(container).mousedown(function(event){event.preventDefault && event.preventDefault(); // 阻止默认行为发生$(container).find(':checkbox').attr('checked',false);var startPos = {top: event.clientY + $(document).scrollTop(), left: event.clientX + $(document).scrollLeft()};this.setCapture && this.setCapture();// mouse move$(container).unbind('mousemove').mousemove(function(event){document.selection && document.selection.empty(); // for ie 取消选择window.getSelection && window.getSelection().removeAllRanges(); // for non ie 取消选择var top = event.clientY + $(document).scrollTop();var left = event.clientX + $(document).scrollLeft();var endPos = {top: Math.max(top, container.offset().top), left: Math.max(left, container.offset().left)};var fixedPoint = { // 设置定点left: endPos.left > startPos.left ? startPos.left : endPos.left,top: endPos.top > startPos.top ? startPos.top : endPos.top}; var w = Math.min(Math.abs(endPos.left - startPos.left), container.offset().left + container.width() - fixedPoint.left);var h = Math.min(Math.abs(endPos.top - startPos.top), container.offset().top + container.height() - fixedPoint.top);box().show().css({left: fixedPoint.left+'px', top: fixedPoint.top+'px', width: w+'px', height: h+'px'});});});}init();return $(this); };})(jQuery);
?
?花了一个晚上研究出来的一个jquery 插件,用鼠标拖拉来选中checkbox
用鼠标拖拉来选中checkbox
用法: 在上面的红框里面点击鼠标左键(或右键),按住不动,移动鼠标 形成选区,再释放鼠标
?
?