无为清净楼资源网

jquery.ui.progressbar 中文文档
网络编程 2024/11/20 佚名
3 2
无为清净楼资源网 Design By www.qnjia.com
复制代码 代码如下:
<?xml version="1.0" encoding="UTF-8" ?>
<!--
注意事项:
1. 以下格式为既定的格式, 为了统一性, 需要修改时, 大家商议
2. 格式中的所有项都是选填, 如果没有, 不写就是了.
3. 由于是XML格式的, 所以, 所有标签中间填写文本的地方(最重要是代码, 一定要加, 不然以后解析有困难), 都需要加上<![CDATA[这中间写内容]]>
4. 翻译过程中, 一块对应的是一个<translate />标签.
5. 希望大家工作愉快.
-->
<project>
<translate item="progressbar" version="7.1">
<translators>
<translator nickname="selfimpr" name="雷果国" mail="lgg860911@yahoo.com.cn" homepage="http://blog.csdn.net/lgg201" qq="285821471" />
</translators>
<relatives>
<depend isitem="false">
<name><![CDATA[jquery]]></name>
<description><![CDATA[jquery的核心库]]></description>
<url><![CDATA[http://docs.jquery.com]]></url>
</depend>
<depend isitem="false">
<name><![CDATA[jquery.ui.core]]></name>
<description><![CDATA[jquery.ui的核心库]]></description>
<url><![CDATA[http://jqueryui.com/demos]]></url>
</depend>
</relatives>
<overview>
<original><![CDATA[
进度条用来设计展现当前一个进度的完成百分比. 进度条的长度在满足默认父容器情况下可以通过CSS灵活改变.
该进度条是一个精确的精度条, 也就是说需要在系统能够保证精确改变当前完成状态时使用.如果不能计算到精确的完成百分比状态, 模糊的进度条(很快会加入)或spinner animation可以带来更好的用户体验
]]></original>
</overview>
<options>
<option name="value" default="0">
<types>
<type name="数字">
</type>
</types>
<description><![CDATA[用来设置进度条初始化时候的完成比.]]></description>
<demos>
<demo>
<comment><![CDATA[初始化]]></comment>
<code><![CDATA[$('.selector').progressbar({value: 37});]]></code>
</demo>
<demo>
<comment><![CDATA[获取属性值]]></comment>
<code><![CDATA[var value = $('.selector').progressbar('option', 'value');
]]></code>
</demo>
<demo>
<comment><![CDATA[设置属性值]]></comment>
<code><![CDATA[$('.selector').progressbar('option', 'value', 37);]]></code>
</demo>
</demos>
</option>
</options>
<events>
<event name="change">
<trigger><![CDATA[processbar的value发生改变]]></trigger>
<arguments>
<argument name="event">
<![CDATA[原生的浏览器事件.]]>
</argument>
<argument name="ui">
<![CDATA[JQuery的ui对象]]>
</argument>
</arguments>
<description><![CDATA[类型: progressbarchange]]></description>
<demos>
<demo>
<comment><![CDATA[初始化时设置事件]]></comment>
<code><![CDATA[
$("#progressbar").progressbar({
change: function(event, ui) {
//this等价于event.target
alert('又完成了1%');
}
});
]]></code>
</demo>
<demo>
<comment><![CDATA[动态的绑定事件. 动态绑定时候, 使用的事件名就是事件的类型.]]></comment>
<code><![CDATA[
$("#progressbar").bind('progressbarchange', function(event, ui) {
//this等价于event.target
alert('又完成了1%');
});
]]></code>
</demo>
</demos>
</event>
</events>
<methods>
<method name="destroy">
<description><![CDATA[完全移除一个进度条控件, 使其回退到该元素被初始化成进度条控件之前的状态.]]></description>
<demos>
<demo>
<code><![CDATA[$("#progressbar").progressbar('destroy');]]></code>
</demo>
</demos>
</method>
<method name="disable">
<description><![CDATA[将可进度条控件样式改变成为失效, 与enable对应.]]></description>
<demos>
<demo>
<code><![CDATA[$(".selector").progressbar('disable');]]></code>
</demo>
</demos>
</method>
<method name="enable">
<description><![CDATA[将进度条控件样式改变为允许, 与disable对应.]]></description>
<demos>
<demo>
<code><![CDATA[$(".selector").progressbar('enable');]]></code>
</demo>
</demos>
</method>
<method name="option">
<arguments>
<argument name="optionName " type="字符串"><![CDATA[选项一节中列举的所有选项名都可用]]></argument>
<argument name="value" type="任意"><![CDATA[该选项可以接受的任意数据值.]]></argument>
</arguments>
<description><![CDATA[获取或设置进度条控件的选项, 第二个参数是选项名, 第三个参数是值. 如果不指定值, 就是获取, 指定值, 就是设置. ]]></description>
<demos>
<demo>
<code><![CDATA[$(".selector").progressbar('option', optionName[, value]);]]></code>
</demo>
</demos>
</method>
<method name="value">
<description><![CDATA[获取或设置进度条控件的当前value值]]></description>
<demos>
<demo>
<code><![CDATA[$(".selector").progressbar('value'[, value]);]]></code>
</demo>
</demos>
</method>
</methods>
<theme><![CDATA[
普通的主题更改可以通过JQuery的在线主题定制方便的选定.
完全的自定义主题:ui.progressbar.css
ui-progressbar: 影响进度条容器样式
ui-progressbar-value: 影响进度条自身样式.
]]></theme>
<demos>
<demo>
<description><![CDATA[
译者注: 将下面的代码直接作为一个HTML文档运行, 就可以明白它是怎么工作的了.
]]></description>
<code><![CDATA[
<!doctype html>
<html lang="en">
<head>
<title>jQuery UI Progressbar - Default functionality</title>
<link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="/UploadFiles/2021-04-02/jquery-1.3.2.js"><script type="text/javascript" src="/UploadFiles/2021-04-02/ui.core.js"><script type="text/javascript" src="/UploadFiles/2021-04-02/ui.progressbar.js"><link type="text/css" href="../demos.css" rel="stylesheet" />
<script type="text/javascript">
$(function() {
var current_value = 0;
change = function() {
$("#progressbar").progressbar('option', 'value', current_value);
current_value ++;
if(current_value <= 100) {
setTimeout('change()', 200);
}
};
progressbar_dynamic = function() {
progressbar_init();
change();
};
progressbar_init = function() {
$("#progressbar").progressbar({
value: current_value,
change: function(event, ui) {
$('#number').text($(this).progressbar('option', 'value'));
document.getElementById('number').style.position = 'relative';
document.getElementById('number').style.left = $(this).progressbar('option', 'value') * ($('.ui-progressbar').width() / 100) - 5;
}
});
};
progressbar_destroy = function() {
$("#progressbar").progressbar('destroy');
};
progressbar_disable = function() {
$("#progressbar").progressbar('disable');
};
progressbar_enable = function() {
$("#progressbar").progressbar('enable');
};
progressbar_option = function() {
var option_name = $('#option_name').val();
var option_value = $('#option_value').val();
if(option_value) {
$("#progressbar").progressbar('option', option_name, option_value);
} else {
$('#option_value').val($("#progressbar").progressbar('option', option_name));
}
};
progressbar_value = function() {
var value_value = $('#value_value').val();
if(value_value) {
$("#progressbar").progressbar('value', value_value);
} else {
$('#value_value').val($("#progressbar").progressbar('option', 'value'));
}
};
});
</script>
<style type="text/css">
input{height: 22px; margin: 1px 2px;}
input[type=button]{border: none; width: 80px;}
input[type=text]{border: 1px solid #BBBBBB; line-height: 20px;}
#number{width: 5px;}
</style>
</head>
<body>
<br /><br />
<div id="number">&nbsp;</div>
<div id="progressbar"></div>
<br /><br />
<input type="button" value="init" onclick="progressbar_init();" />
&nbsp;&nbsp;
<input type="button" value="destroy" onclick="progressbar_destroy();" />
&nbsp;&nbsp;
<input type="button" value="disable" onclick="progressbar_disable();" />
&nbsp;&nbsp;
<input type="button" value="enable" onclick="progressbar_enable();" />
&nbsp;&nbsp;
<input type="button" value="dynamic" onclick="progressbar_dynamic();" />
<br />
<input type="button" value="option" onclick="progressbar_option();" />
选项名: <input type="text" id="option_name" />
选项值: <input type="text" id="option_value" />
<br />
<input type="button" value="value" onclick="progressbar_value();" />
完成度: <input type="text" id="value_value" />
<br />
<hr />
init: 初始化一个进度条
destroy: 销毁进度条
disable: 失效
enable: 有效
dynamic: 一个模拟的动态加载效果
option: 测试option方法
value: 测试value方法
</body>
</html>
]]></code>
</demo>
</demos>
<summarize><![CDATA[
progressbar是一个用value来控制显示进度条的插件, 最关键的地方在于value属性和value方法. 用自己的程序控制改变value以显示当前进度..
]]></summarize>
</translate>
</project>

保存为xml格式文件。注意编码转换。
标签：
progressbar,中文文档
无为清净楼资源网 Design By www.qnjia.com
广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站文章均来自网站采集或用户投稿，网站不提供任何软件下载或自行开发的软件！ 如有用户或公司发现本站内容信息存在侵权行为，请邮件告知！ 858582#qq.com
无为清净楼资源网 Design By www.qnjia.com
www.qnjia.com 无为清净楼资源网
139,976互联网资源
144,792高清电影
21,817无损音乐
631,128技术资源

更新日志

友情链接

杰晶网络 DDR爱好者之家 桃源资源网 杰网资源 富贵资源网 南强小屋 铁雪资源网 幽灵资源网 万梅资源网 狼山资源网 白云岛资源网 昆仑资源网 相思资源网 明霞山资源网 内蒙古资源网 黑松山资源网 茶园资源网 饿虎岗资源网 大旗谷资源网 常春岛资源网 岱庙资源网 兴国资源网 快活林资源网 蝙蝠岛资源网 帝王谷资源网 白云城资源网 伏龙阁资源网 清风细雨楼 天枫庄资源网 圆月山庄资源网 无争山庄资源网 神水资源网 移花宫资源网 神剑山庄资源网 无为清净楼资源网 金钱帮资源网 丐帮资源网 华山资源网 极乐门资源网 小李飞刀资源网 凤求凰客栈 风云阁资源网 金狮镖局 鸳鸯亭资源网 千金楼资源网 更多链接