[b]一、JQUBAR(V1.0)JQUERY插件简介
[/b]1.支持.net、java、php等平台。
2.用户可以通过鼠标拖拽柱状图从而改变每根柱子的高度,最终达到通过鼠标拖拽图形界面来修改服务器数据的目的。
3.支持柱状图缩放。
4.目前支持浏览器:IE7、 IE8、 Firefox、Chrome。
[b]二、HTML
[/b]
[url=<%=Url.Content(]
注:以上文件请引入至html <head></head>内。
[b]四、加入Javascript 代码
[/b]
<script type="text/javascript">
$(function () {
$("#con").jQUBar({
zoom: true,
drag: true,
url: '<%=Url.Action("LoadData") %>'
});
$("#btnReloadBar").click(function () {
$("#con").setBarParam({
zoom: $("#cbZoom").attr("checked"),
drag: $("#cbDragable").attr("checked"),
//提供json数据,方便 .net java php 调用。本例在Asp.net MVC2.0下演示
url: '<%=Url.Action("LoadData") %>/?name=' + $("#txtName").val()
}).reload();
});
});
</script>
注:以上js脚本同样请加入html <head></head>内。
[b]五、ASP.NET MVC2.0 服务端代码
[/b]
[url=http://xiazai.jb51.net/201011/yuanma/JQUBar.rar]JQUBAR1.0插件[/url]。
衷心的感谢各位园友对该插件提出您的宝贵意见,根据大家的意见我将抽出时间对JQUBAR1.0插件进行升级。
同时也希望本篇文章可以帮您解决开发中碰到的问题。
作者:RyanDing
出处:[url=http://www.cnblogs.com/ryanding/]http://www.cnblogs.com/ryanding/[/url]