<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
</head>
<script language="javascript" src="script/jquery.js"></script>
<script type="text/javascript">
$(window).load(function(){
//$(":button").each(function() {
// $(this).attr("disabled", true);
//});
//$(":text").each(function() {
// $(this).attr("readonly", true);
//});
//$(":textarea").each(function() {
// $(this).attr("readonly", true);
//});
//$("a").each(function() {
// $(this).replaceWith("<a style='cursor:hand'>"+$(this).html()+"</a>");
//});
})
;(function($, window) {
$.fn.textlimit = function(options) {
var defaults = {
// 插件自定义选项的默认值
stylecss:"",
maxheigth:250,
maxlength:50
};
// 以用户的自定义选项覆盖默认选项
var options = $.extend(defaults, options);
return this.each(function() { // 让插件支持链式操作
// 在这里编写插件功能代码
var tip_id=this.id+"_tip";
var tip_obj=$("#"+tip_id);
//alert(tip_obj);
var tip;
if(tip_obj.html()==null||tip_obj.html()==undefined){
tip="<span>您还可以输入<span id='"+this.id+"_tip' style='color:red;font-weight: bolder;"+options.stylecss+"' >0</span>字</span>";
$(this).after(tip);
}
//获取初始时的原始高度
var default_height=$(this).height();
$(this).bind("propertychange click keyup keydown slideToggle",function(){
var o = options;
//字符长度显示
var length=$(this).text().length;
// $("#"+tip_id)与tip_obj的区别
$("#"+tip_id).text(o.maxlength-length);
//字符截取
if(length>o.maxlength){
$(this).text($(this).text().substring(0, o.maxlength));
}
//设置高度
var height=$(this).height();
var scroll=$(this)[0].scrollHeight;
var aa=("scroll:"+scroll+" height:"+height+" maxheigth:"+o.maxheigth+" default_heigth:"+default_height);
$("#div1").text(aa);
if(scroll<height){
$("#textarea1").css({"overflow-y":""});
//$("#textarea1").height(default_heigth);
$("#textarea1").height(default_height);
}else if(scroll>=height&&scroll<=o.maxheigth){
$("#textarea1").css({"overflow-y":"visible"});
$("#textarea1").height(scroll);
}else if(scroll>o.maxheigth){
$("#textarea1").height(o.maxheigth);
$("#textarea1").css({"overflow-y":""});
}
//alert(length);
});
});
// 在这里编写插件功能代码
};
})(jQuery, window);
</script>
<script type="text/javascript" >
$(function(){
$("#textarea1").textlimit({stylecss:""});
//alert("aa");
});
</script>
<body>
<br>
<textarea id="textarea1" name="" rows="5" cols="100" ></textarea><br/><br/><br/>
<input maxlength="" ><br/><br/>
<input type="button" value="aaaaaaa" style="font-weight: bolder;" ><br/><br/>
<input type="button" value="aaaaaaa"><br/><br/>
<input type="button" value="aaaaaaa" ><br/><br/>
<div id="div1" style="color:red;" >aaa</div>
<br>
</body>
</html>
分享到:
相关推荐
总的来说,自定义jQuery插件是一种强大且灵活的方式,可以扩展jQuery的功能,满足特定项目的需求。在本例中,我们创建了一个Notification插件,使得在jQuery应用中添加通知功能变得更加便捷。通过这种方式,你可以...
标题所指的知识点是“如何通过自定义jQuery插件的方式实现网页中对象的强制重绘”。描述部分则说明了文章的主要内容:介绍了通过自定义jQuery插件实现对象强制重绘的方法,并且通过实例分析了相关的技巧。此内容对于...
此外,开发自定义jQuery插件也是一项重要技能。这涉及到了解jQuery的扩展机制,包括`.fn.extend`、闭包和模块化。自定义插件可以帮助我们封装复用的代码,提高代码质量。 总结来说,"java源代码,主要是jquery插件...
6. 自定义Jquery插件:可能包括弹窗、滑动菜单、滚动特效等,增强了用户体验。 此源码可以作为学习C# ASP.NET和Jquery结合开发的实例,帮助开发者了解如何在实际项目中整合这两种技术。通过阅读和分析这些源码,...
自定义jQuery插件 如果你需要创建自己的jQuery插件,可以按照以下步骤: 1. 定义一个函数,作为插件的核心。 2. 使用`$.fn.extend`将函数添加到jQuery原型链上。 3. 在函数内部,获取当前选择的元素集,并根据...
jQuery自定义下拉框插件 jQuery自定义下拉框插件 jQuery自定义下拉框插件 jQuery自定义下拉框插件 jQuery自定义下拉框插件 jQuery自定义下拉框插件
`jquery.easydropdown.min.js`是一个轻量级的jQuery插件,它的主要功能是将传统的Select元素转换为具有自定义样式的下拉菜单。这个插件通过JavaScript和CSS实现了高度可定制的外观和行为,同时保持了原生Select的...
自定义jQuery插件 创建自己的jQuery插件,首先要明确插件的目的和功能。然后,根据需求设计插件的API,包括参数、配置项等。接着编写实现功能的核心代码,最后测试插件的兼容性和性能,确保在各种环境下都能正常...
微信公众号自定义菜单jQuery插件,可以多账号使用, 消息包含:图文消息、图片、语音、视频、网页链接,编辑后可以实时在线预览功能,保存、同步、清空菜单等功能则需要自己实现后台代码。
在这个项目中,我们有一个名为“自定义jquery-wizard插件”的实现,通过提供的资源文件,我们可以看到一个完整的实现案例。 1. **主要文件解析:** - **jquery-wizard.1.0.css**:这是样式表文件,包含了插件的...
**五、自定义jQuery插件** 如果你有特定需求,可以基于jQuery框架开发自己的插件。理解jQuery的API和插件构造原理,可以让你轻松构建高效且可复用的代码模块。 总之,jQuery插件是提升Web应用功能性和用户体验的...
如果现有的插件无法满足需求,可以考虑自定义jQuery插件。自定义插件通常有三种形式:封装对象方法、封装全局函数以及选择器插件。在创建自定义插件时,应遵循一定的命名和编码规范,以避免与其他插件冲突,同时确保...
微信公众号自定菜单jQuery插件,完善图文消息、图片、语音、视频,在线预览,很好用,插件下载即可使用,js中存在预览数据,如需使用后台则打开AJAX代码,后台代码需自己完善。。
标题 "我的第一个jQuery插件 -- 圆角DIV" 指涉的是一个关于创建自定义jQuery插件的教程,该插件主要用于实现HTML元素(尤其是DIV)的圆角效果。在早期的Web开发中,CSS2无法直接创建圆角,所以开发者会利用...
自定义jQuery插件的实践 例如,我们可以开发一个简单的计数器插件,每当元素被点击时,计数器增加: ```javascript (function($){ $.fn.counter = function() { return this.each(function() { var $this = $...
#### 3.1 自定义jQuery插件 我们可以编写自定义的jQuery插件来实现Tab效果。以下是一个简单的示例: ```javascript $.fn.myTab = function() { this.each(function() { var $this = $(this); $this.find('li a'...