JS实用插件

王朝学院·作者佚名  2016-05-23
窄屏简体版  字體: 小  |  中  |  大  |  超大  

JS实用插件1.jQuery鼠标滚轮事件插件Mouse Wheel

下载链接:https://github.com/brandonaaron/jquery-mousewheel/

使用方法:

// using bind$('#my_elem').bind('mousewheel', function(event, delta) {console.log(delta);});// using the event helper$('#my_elem').mousewheel(function(event, delta) {console.log(delta);});

要注意的是回调函数的第二个参数delta,它响应滚轮的方向,当为负数时表示向下滚动,为正则表示向上滚动。

2. javascript路由插件

Crossroads.js, Director.js或是Sammy.js

推荐Crossroads.js 使用详情google或百度

3. 复制到剪切板插件zeroclipboard

下载地址:http://zeroclipboard.org/

使用方法:

<div id="click" data-clipboard-text="111111111111">点我复制</div>

if($.browser.msie){ $("#click").click(function(){ var text = $("#click").attr("data-clipboard-text"); clipboardData.setData("Text",text); });}else{ window.client = new ZeroClipboard( $("#click"));}

4. jQuery 实现标点内容自动保存插件sisyphus.js

下载地址:http://sisyphus-js.herokuapp.com/

实用方法:$('form').sisyphus();

设置选项,用户可随意进行设置:

customKeyPRefix:自定义本地存储文件头

timeout:间隔多长时间对数据进行自动保存。如果设置为0,那么所以字段更改都将被自动保存

onSave:每次数据自动保存到本地存储将触发的函数。

onRestore:如果数据从本地存储被恢复,触发的函数。

onBeforeRestore:数据从本地存储恢复之前被触发。该函数只触发一次

onRelease:本地存储清空之前将触发该函数。

autoRelease:设置本地自动保存的表单数据是否在表单提交或者重置的时候自动清空。如果设置为false,为自己手动擦除本地存储的数据,插件专门提供了manuallyReleaseData方法进行擦除。

excludeFields:从选定的表单中排除指定的字段。如$("textarea,:text")

name:表单的识别部分。sisyphus本地存储表单文件的名称。默认情况下为当前页面URL地址,是一个确定值。如果一个页面有多个地址,为了获取一致的数据,请设置一个唯一的name值。

例如:下面的代码将对当前页面所有表单每5秒自动进行数据保存:

$('form').sisyphus({timeout: 5});

5.placeholder插件

百度很多这个插件有的ie不管用下面这个是ie有用的

/*! http://mths.be/placeholder v2.0.8 by @mathias */;(function(window, document, $) { // Opera Mini v7 doesn’t support placeholder although its DOM seems to indicate so var isOperaMini = Object.prototype.toString.call(window.operamini) == '[object OperaMini]'; var isInputSupported = 'placeholder' in document.createElement('input') && !isOperaMini; var isTextareaSupported = 'placeholder' in document.createElement('textarea') && !isOperaMini; var prototype = $.fn; var valHooks = $.valHooks; var propHooks = $.propHooks; var hooks; var placeholder; if (isInputSupported && isTextareaSupported) { placeholder = prototype.placeholder = function() { return this; }; placeholder.input = placeholder.textarea = true; } else { placeholder = prototype.placeholder = function() { var $this = this; $this .filter((isInputSupported ? 'textarea' : ':input') + '[placeholder]') .not('.placeholder') .bind({ 'focus.placeholder': clearPlaceholder, 'blur.placeholder': setPlaceholder }) .data('placeholder-enabled', true) .trigger('blur.placeholder'); return $this; }; placeholder.input = isInputSupported; placeholder.textarea = isTextareaSupported; hooks = { 'get': function(element) { var $element = $(element); var $passWordInput = $element.data('placeholder-password'); if ($passwordInput) { return $passwordInput[0].value; } return $element.data('placeholder-enabled') && $element.hasClass('placeholder') ? '' : element.value; }, 'set': function(element, value) { var $element = $(element); var $passwordInput = $element.data('placeholder-password'); if ($passwordInput) { return $passwordInput[0].value = value; } if (!$element.data('placeholder-enabled')) { return element.value = value; } if (value == '') { element.value = value; // Issue #56: Setting the placeholder causes problems if the element continues to have focus. if (element != safeActiveElement()) { // We can't use `triggerHandler` here because of dummy text/password inputs :( setPlaceholder.call(element); } } else if ($element.hasClass('placeholder')) { clearPlaceholder.call(element, true, value) || (element.value = value); } else { element.value = value; } // `set` can not return `undefined`; see http://jsapi.info/jquery/1.7.1/val#L2363 return $element; } }; if (!isInputSupported) { valHooks.input = hooks; propHooks.value = hooks; } if (!isTextareaSupported) { valHooks.textarea = hooks; propHooks.value = hooks; } $(function() { // Look for forms $(document).delegate('form', 'submit.placeholder', function() { // Clear the placeholder values so they don't get submitted var $inputs = $('.placeholder', this).each(clearPlaceholder); setTimeout(function() { $inputs.each(setPlaceholder); }, 10); }); }); // Clear placeholder values upon page reload $(window).bind('beforeunload.placeholder', function() { $('.placeholder').each(function() { this.value = ''; }); }); } function args(elem) { // Return an object of element attributes var newAttrs = {}; var rinlinejQuery = /^jQuery\d+$/; $.each(elem.attributes, function(i, attr) { if (attr.specified && !rinlinejQuery.test(attr.name)) { newAttrs[attr.name] = attr.value; } }); return newAttrs; } function clearPlaceholder(event, value) { var input = this; var $input = $(input); if (input.value == $input.attr('placeholder') && $input.hasClass('placeholder')) { if ($input.data('placeholder-password')) { $input = $input.hide().next().show().attr('id', $input.removeAttr('id').data('placeholder-id')); // If `clearPlaceholder` was called from `$.valHooks.input.set` if (event === true) { return $input[0].value = value; } $input.focus(); } else { input.value = ''; $input.removeClass('placeholder'); input == safeActiveElement() && input.select(); } } } function setPlaceholder() { var $replacement; var input = this; var $input = $(input); var id = this.id; if (input.value == '') { if (input.type == 'password') { if (!$input.data('placeholder-textinput')) { try { $replacement = $input.clone().attr({ 'type': 'text' }); } catch(e) { $replacement = $('<input>').attr($.extend(args(this), { 'type': 'text' })); } $replacement .removeAttr('name') .data({

 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
 
© 2005- 王朝網路 版權所有 導航