开发项目时，经常需要自已开发一些UI组件，在这里共享一个刚开发的Button控件，这个Button使用很简单，只要加入相关的CSS和JS文件，这样页面中的所有input按扭都将会被自动渲染为漂亮的个性化按扭，不需要写一句代码。
源代码和示例在附件中,Button的相关JS源代码如下:
(function($){
$.fn.btn = function(){
var btn = this.data("_self");;
if(btn){
return btn;
};
this.init = function(){
var obj = $(this);
var id=$(this).attr('id')||"gen"+Math.random();
var icon = $(this).attr('icon')||'icon-btncom';
var bntStr=[
'<table id="',id,'" class="z-btn" cellSpacing=0 cellPadding=0 border=0><tbody><tr>',
'<TD class=z-btn-left><i> </i></TD>',
'<TD class=z-btn-center><EM unselectable="on">',
'<BUTTON class="z-btn-text ',icon,'" >',$(this).attr('value'),'</BUTTON>',
'</EM></TD>',
'<TD class=z-btn-right><i> </i></TD>',
'</tr></tbody></table>'
];
var bnt = $(bntStr.join('')).btn();
bnt._click = eval(obj.attr("onclick"));
bnt.disable();
if(obj.attr("disabled"))
bnt.disable();
else bnt.enable();
$(this).replaceWith(bnt);
bnt.data("_self", bnt);
return bnt;
};
this.enable = function(){
this.removeClass("z-btn-dsb");
this.click(this._click);
this.hover(
function () {
$(this).addClass("z-btn-over");
},
function () {
$(this).removeClass("z-btn-over");
}
)
};
this.disable = function(){
this.addClass("z-btn-dsb");
this.unbind("hover");
this.unbind("click");
};
return this;
};
$(function(){
$("input[type='button']").each(function(){
$(this).btn().init();
});
$("input[type='reset']").each(function(){
$(this).btn().init().click(function(){
var form = $(this).parents("form")[0];
if(form)
form.reset();
});
});
$("input[type='submit']").each(function(){
$(this).btn().init().click(function(){
var form = $(this).parents("form")[0];
if(form)
form.submit();
});
});
})
})(jQuery);
[img][/img]
- 大小: 107.2 KB
分享到：
相关推荐
在这个名为"ASP.NET源代码共享"的主题中，我们可以推测这是一个关于分享ASP.NET相关项目源代码的资源。尽管描述部分为空，但从标签"源码"和"工具"可以推断，这个压缩包可能包含了一个或多个实用的ASP.NET工具或示例...
"Lee10DateTime-K1.0"这款控件具有无加密源码的特点，意味着开发者可以自由查看和修改源代码，以便更好地理解和定制功能。 该控件的核心功能包括： 1. **显示日历**：控件会根据指定的HTML元素生成一个日历界面，...
在描述中提到的C#源代码，可能是基于Highcharts的.NET封装，方便.NET开发者更便捷地集成和使用Highcharts。 在实际应用中，Highcharts主要通过JavaScript API进行配置和操作。开发者可以通过设置各种选项来定制图表...
在这里，描述提到这个控件是网上找到的源代码，意味着它可能是一个开源或者共享的项目，开发者可以自由下载、使用甚至修改来适应自己的项目需求。 首先，我们来探讨一下FileUpload控件的基本功能。在传统的HTML中，...
日历表格面板 [ConfigLine.java] 控制条类 [RoundBox.java] 限定选择控件 [MonthMaker.java] 月份表算法类 [Pallet.java] 调色板，统一配色类 Java扫雷源码 Java生成自定义控件源代码 2个目标文件 Java实现HTTP连接...
在“ASP.NET 开发局域网文件共享及检索系统的设计与开发(源代码+论文)”这个项目中，我们可以看到开发者利用ASP.NET技术构建了一个针对局域网环境的文件共享和检索系统。下面将详细解释此系统的开发要点和涉及的关键...
在提供的文件"2006379481763"中，可能包含了实现上述功能的源代码、示例或者相关文档。通过研究这些文件，开发者可以学习如何在自己的项目中实现类似的Web打印功能。 总的来说，Web打印控件在电子商务、在线报表、...
源代码的提供对于初学者和开发者来说，是一个极好的学习资源，可以深入理解ASP.NET的编程模型和Web应用的开发流程。 该项目主要涉及以下几个核心知识点： 1. **ASP.NET Web Forms**：作为ASP.NET的基础，Web Forms...
这意味着天气预报插件的源代码可能是用ASP语言编写的，这将涉及到ASP的基础语法、服务器控件、请求响应处理等相关知识。 【文件名称列表解析】 由于提供的文件名称列表只有一个数字串"132687961360656692"，这通常...
- 对于跨域请求或安全考虑，需要理解并配置CORS（跨源资源共享）策略。 - 确保在不支持JavaScript的环境中，应用也能正常工作，提供良好的降级策略。 通过"AJAXEnabledWebSite1"项目的实践和学习，你将能掌握ASP...
同源策略是浏览器安全机制的一部分，阻止了不同源的页面之间共享数据，例如，当一个iframe尝试访问其父窗口的数据时，如果它们的源不相同，就会遇到限制。在IIS服务器上测试可能是为了模拟一个更严格的环境，确保...
在压缩包的“1.1”文件中，可能包含了该日历控件的源代码、资源文件、文档说明或者示例项目。这些资源可以帮助开发者更深入地理解控件的工作原理，对其进行定制或整合到自己的项目中。源代码的结构和注释将有助于...
标题中的“省市区三级联动C#源代码(含全国各地市数据库)无刷新非ASMX服务”指的是一个基于C#编程语言实现的Web应用程序，用于在网页上实现省、市、区三级联动的选择功能，且无需页面刷新。这个系统通常用在用户填写...
这个“ASP基于WEB的办公自动化管理系统”源代码和设计说明书的压缩包提供了一个实际应用实例，帮助我们了解如何利用ASP技术来实现企业或组织内部的办公自动化。 办公自动化管理系统（Office Automation System, OAS...
一旦日历控件在工具箱中可用，我们就可以在设计视图中拖放到网页上，或者在源代码视图中通过以下方式手动添加： ```html <asp:Calendar ID="Calendar1" runat="server"></asp:Calendar> ``` 日历控件提供了一些...
8. **数据源集成**：与后台数据库或其他数据源（如Google日历、Outlook等）的集成，可以实现日程的同步和共享。 9. **性能优化**：优秀的日历控件会考虑性能优化，如延迟加载、缓存策略等，以减少页面加载时间和...
7. **跨域上传**：如果需要在多个域之间进行文件上传，需要处理CORS（跨源资源共享）设置，确保服务器允许从其他域名发送上传请求。 总之，.NET文件上传控件是一个复杂但重要的功能，涉及到前端交互、后端处理、...
3. **初始化jqGrid**：通过JavaScript调用`$("#tableId").jqGrid()`方法初始化表格，配置相关的参数，如列信息、数据源、操作按钮等。 4. **加载数据**：根据数据源类型，设置相应的URL或数据，jqGrid会自动处理...