`

DWRUtils API 使用方法

    博客分类:
  • Ajax
阅读更多
DWRUtils API 使用方法(转载) 
Tag:ajax  dwr    这篇文章不错,快看看收藏了该文章的所有3人,我也要收藏     


$("precloneNode1suf") 取得该对象;

DWRUtil.selectRange("selectRangeBasic", 5, 15) 选中selectRangeBasic文本框里面从第五个字符到第15个字符之间的字符.

DWRUtil._getSelection("selectRangeBasic") 得到selectRangeBasic文本框里选中的字符.

var arrayFive = [ 'One', 'Two', 'Three', 'Four', 'Five' ];
DWRUtil.addOptions('addOptionsBasic', arrayFive); 将数组添加到下拉菜单里面去;
DWRUtil.getValue('addOptionsBasic') 得到 addOptionsBasic 对象的值;
DWRUtil.getValue("precloneNode1Inner1suf", { textContent:true }); 后

面加个参数,在 precloneNode1Inner1suf元素为"UL" 时,它返回了元素里面得值,也就是说去掉了HTML标签部分.

DWRUtil.getText('addOptionsBasic') 得到下拉框 addOptionsBasic 显示的文本;
var arrayObject = [
{ name:'One', value:'1' },
{ name:'Two', value:'2' },
{ name:'Three', value:'3' },
{ name:'Four', value:'4' },
{ name:'Five', value:'5' }
];

DWRUtil.addOptions('addOptionsObject1', arrayObject, "name"); 将数组添加到下拉菜单里面去;后面的参数是确定那个是给用户显示的文本,同时也是值;

DWRUtil.addOptions('addOptionsObject1', arrayObject, "name","value"); 同上,不过后面参数是: 3=文本;4=值;
var map = { one:1, two:2, three:3, four:4, five:5 };
DWRUtil.addOptions('addOptionsMap1', map); 同上, one 是值;1 是文本;
DWRUtil.addOptions('addOptionsMap1', map,true); 同上, 1 是值;one 是文本;

-------------------------------------------------------------------------------------
<ul id="removeItems">
<li>One</li><li>Two</li><li>Three</li><li>Four</li><li>Five</li>
</ul>

如果是列表显示,如上;则上面所有方法和select 下拉框使用一样;
-------------------------------------------------------------------------------------
DWRUtil.cloneNode('cloneNode1', { idPrefix:'pre', idSuffix:'suf' });克隆一个节点,参数一为要克隆的节点的id,第二个参数是在克隆的节点id前面加pre,后面加suf.(注意:如果该节点有子节点的话,子节点的名字也一样加)

DWRUtil.addRows(id, array, cellfuncs, [options]);
原理:

for each member in array
for each function in cellfuncs
create cell from cellfunc(array[i])
循环数组,循环函数,建立单元调用函数;(顺序决定)

例如:
DWRUtil.addRows('addRowsBasic', arrayFive, [
function(data) { return data; },
function(data) { return data.toUpperCase(); },
function(data) {
var input = document.createElement("input");
input.setAttribute("type", "button");
input.setAttribute("value", "DOM Test");
input.setAttribute("onclick", "alert('" + data + "');");
return input;
},
function(data) { return "<input type='button' value='innerHTML Test' onclick='alert(\"" + data + "\");'>"; }
]);


高级部分:
第四个参数为对单元的高级操作,主要下面的两个方法;
function defaultRowCreator(options) {
return document.createElement("tr");
};

function defaultCellCreator(options) {
return document.createElement("td");
};

例子:
DWRUtil.addRows( "demo2",[ 'Africa', 'America', 'Asia', 'Australasia', 'Europe' ] , cellFuncs, {
rowCreator:function(options) {
var row = document.createElement("tr");
var index = options.rowIndex * 50;
row.style.color = "rgb(" + index + ",0,0)";
return row;
},
cellCreator:function(options) {
var td = document.createElement("td");
var index = 255 - (options.rowIndex * 50);
td.style.backgroundColor = "rgb(" + index + ",255,255)";
td.style.fontWeight = "bold";
return td;
}
});


其中 options 参数的属性可用的为:(没试过,自己试试吧)
rowData: the element value from the array (the same for all cells in a row) 
rowIndex: the key (if map) or index (if array) from the collection 
rowNum: The row number counting from 0 in this section (so if you are using tbody, it counts rows in the tbody and not the whole table) 
data: The 'computed' data value for the cell (cellCreators only) 
cellNum: The cell number that we are altering counting from 0 (cellCreators only) 


DWRUtil.setValues(); 批量设置值;
var settings = {
setValuesDiv:"setValuesDiv",
setValuesSpan:"setValuesSpan",
setValuesSelect:"two",
setValuesText:"setValuesText",
setValuesPassword:"AB",
setValuesTextarea:"setValuesTextarea",
setValuesButton1:"B1-Two",
setValuesButton2:"B2-Two",
setValuesRadio1:true,
setValuesRadio2:false,
setValuesRadio3:"one",
setValuesRadio4:"two",
setValuesCheckbox1:true,
setValuesCheckbox2:false
};
DWRUtil.setValues(settings);

DWRUtil.getValues(empty);批量获取值;
var empty = {
setValuesDiv:null,
setValuesSpan:null,
setValuesSelect:null,
setValuesText:null,
setValuesPassword:null,
setValuesTextarea:null,
setValuesButton1:null,
setValuesButton2:null,
setValuesRadio1:null,
setValuesRadio2:null,
setValuesRadio3:null,
setValuesRadio4:null,
setValuesCheckbox1:null,
setValuesCheckbox2:null
};
DWRUtil.getValues(empty);

DWRUtil.useLoadingMessage("Ping");//类似gmail那个样子,在右上角显示加载"ping";可用自定样式,具体查询;http://getahead.ltd.uk/dwr/browser/util/useloadingmessage

DWRUtil.toDescriptiveString("id",数字);弹出调试信息,数字为0,1,2.一级比一级高.

DWRUtil.onReturn(event, submitFunction);一般在form表单里面,防止在文本框上按回车就提交表单.
例如:
<input type="text"
onkeypress="DWRUtil.onReturn(event, submitFunction)"/>
<input type="button" onclick="submitFunction()"/>
 

分享到:
评论

相关推荐

    DWRUtils高级使用帮助

    DWRUtils是一个JavaScript库,它与Direct Web Remoting (DWR)框架一起使用,简化了在浏览器端与服务器端进行交互的过程。DWR允许在客户端和服务器之间实时地交换数据,而无需刷新整个页面。DWRUtils提供了许多便利的...

    dwr utils.js常用方法整理

    然而,当尝试通过 `$(“test3”)` 获取具有相同名称但无特定ID的元素时,代码将会抛出异常,因此在使用这些方法时,确保传递正确的元素ID至关重要。 ### 2. 取值:getValue()/getValues()/getText() #### getValue...

    2024年机器人大作业代码

    2024年机器人大作业代码

    学生信息管理系统,idea-mysql小项目,记录一下

    这是mysql文件直接导入就行了,可以查一下相关指令例如:mysql -u root -p mydb_copy < mydb.sql就好了,这里就不多赘述了

    搜索关键字飞入飞出效果.zip

    Android 毕业设计,Android 毕业设计,小Android 程设计,含有代码注释,新手也可看懂。毕业设计、期末大作业、课程设计、高分必看,下载下来,简单部署,就可以使用。 包含:项目源码、数据库脚本、软件工具等,该项目可以作为毕设、课程设计使用,前后端代码都在里面。 该系统功能完善、界面美观、操作简单、功能齐全、管理便捷,具有很高的实际应用价值。

    基于ssm的团员管理系统源代码(完整前后端+mysql+说明文档+LW).zip

    管理员 管理员信息管理 学院管理 辅导员管理 学生信息管理 公告信息 辅导员 个人资料修改 团员信息管理 优秀团员管理 团费缴纳管理 团员活动管理(主题,内容,参与人数,日期) 团员活的报名 学生 个人资料修改 入团申请管理(提交申请,申请结果查看) 团员活动查看(只能查看,不能修改,活动报名) 团员活动报名 环境说明: 开发语言:Java 框架:ssm,mybatis JDK版本:JDK1.8 数据库:mysql 5.7 数据库工具:Navicat11 开发软件:eclipse/idea Maven包:Maven3.3 服务器:tomcat7

    基于springboot图书管理系统源码+数据库+详细使用说明(高分毕设项目)

    基于springboot图书管理系统源码+数据库+详细使用说明(高分毕设项目),个人大四的毕业设计、经导师指导并认可通过的高分设计项目,评审分99分,代码完整确保可以运行,小白也可以亲自搞定,主要针对计算机相关专业的正在做毕设的学生和需要项目实战练习的学习者,也可作为课程设计、期末大作业。 基于springboot图书管理系统源码+数据库+详细使用说明(高分毕设项目)基于springboot图书管理系统源码+数据库+详细使用说明(高分毕设项目)基于springboot图书管理系统源码+数据库+详细使用说明(高分毕设项目)基于springboot图书管理系统源码+数据库+详细使用说明(高分毕设项目)基于springboot图书管理系统源码+数据库+详细使用说明(高分毕设项目)基于springboot图书管理系统源码+数据库+详细使用说明(高分毕设项目)基于springboot图书管理系统源码+数据库+详细使用说明(高分毕设项目)个人大四的毕业设计、经导师指导并认可通过的高分设计项目,评审分99分,代码完整确保可以运行,小白也可以亲自搞定,主要针对计算机相关专业的正在做毕设的学生和需要。

    Python项目-自动办公-51 Excel_案例_把文件夹整理到Excel中.zip

    Python课程设计,含有代码注释,新手也可看懂。毕业设计、期末大作业、课程设计、高分必看,下载下来,简单部署,就可以使用。 包含:项目源码、数据库脚本、软件工具等,该项目可以作为毕设、课程设计使用,前后端代码都在里面。 该系统功能完善、界面美观、操作简单、功能齐全、管理便捷,具有很高的实际应用价值。

    汽车检测33-YOLO(v5至v9)数据集合集.rar

    汽车检测33-YOLO(v5至v9)数据集合集.rar多对象-V4 2023-03-12 9:33 PM ============================= *与您的团队在计算机视觉项目上合作 *收集和组织图像 *了解和搜索非结构化图像数据 *注释,创建数据集 *导出,训练和部署计算机视觉模型 *使用主动学习随着时间的推移改善数据集 对于最先进的计算机视觉培训笔记本,您可以与此数据集一起使用 该数据集包含4278张图像。 多对象以Yolo V5 Pytorch格式注释。 将以下预处理应用于每个图像: *调整大小为640x640(拉伸) 应用以下扩展来创建每个源图像的3个版本: 将以下转换应用于每个图像的边界框: *以下90度旋转之一的同等概率:无,顺时针,逆时针方向

    Python项目-自动办公-44 excel处理实例(二维表转一维表).zip

    Python课程设计,含有代码注释,新手也可看懂。毕业设计、期末大作业、课程设计、高分必看,下载下来,简单部署,就可以使用。 包含:项目源码、数据库脚本、软件工具等,该项目可以作为毕设、课程设计使用,前后端代码都在里面。 该系统功能完善、界面美观、操作简单、功能齐全、管理便捷,具有很高的实际应用价值。

    三亚市2005-2024年近20年历史气象数据下载

    三亚市2005-2024年近20年的历史气象数据,每3小时更新一次数据,参数包含气温、气压、降水量、云层、能见度、风向、湿度等,几万条数据

    公开整理-全国高校各专业及分方向研究生录取人数大数据(更新至2022年).zip

    详细介绍及样例数据:https://blog.csdn.net/T0620514/article/details/144542157

    javaweb音乐网系统-lw.zip

    项目包含前后台完整源码。 项目都经过严格调试,确保可以运行! 具体项目介绍可查看博主文章或私聊获取 助力学习实践,提升编程技能,快来获取这份宝贵的资源吧!

    Python项目-自动办公-08 用Python设置Word文档里表格的格式.zip

    Python课程设计,含有代码注释,新手也可看懂。毕业设计、期末大作业、课程设计、高分必看,下载下来,简单部署,就可以使用。 包含:项目源码、数据库脚本、软件工具等,该项目可以作为毕设、课程设计使用,前后端代码都在里面。 该系统功能完善、界面美观、操作简单、功能齐全、管理便捷,具有很高的实际应用价值。

    STM32F103通过WIFI接收配置信息修改BC260-NBIOT模块的目标IP和端口程序代码

    1、嵌入式物联网单片机项目开发实战。例程经过精心编写,简单好用。 2、代码使用KEIL 标准库开发,当前在STM32F103运行,如果是STM32F103其他型号芯片,依然适用,请自行更改KEIL芯片型号以及FLASH容量即可。 3、软件下载时,请注意keil选择项是jlink还是stlink。 4、有偿指导v:wulianjishu666; 5、如果接入其他传感器,请查看发布的其他资料。 6、单片机与模块的接线,在代码当中均有定义,请自行对照。 7、若硬件差异,请根据自身情况调整代码,程序仅供参考学习。 8、代码有注释说明,请耐心阅读。

    瓶罐瓶子罐子检测75-YOLO(v5至v9)、COCO、CreateML、Darknet数据集合集.rar

    瓶罐瓶子罐子检测75-YOLO(v5至v9)、COCO、CreateML、Darknet数据集合集.rar街7级-V2 2023-04-28 11:45 PM ============================= *与您的团队在计算机视觉项目上合作 *收集和组织图像 *了解和搜索非结构化图像数据 *注释,创建数据集 *导出,训练和部署计算机视觉模型 *使用主动学习随着时间的推移改善数据集 对于最先进的计算机视觉培训笔记本,您可以与此数据集一起使用 该数据集包括8934张图像。 街道以可可格式注释。 将以下预处理应用于每个图像: *像素数据的自动取向(带有Exif-Arientation剥离) *调整大小为640x640(拉伸) 没有应用图像增强技术。

    基于ssm的高速公路收费系统源代码(完整前后端+mysql+说明文档+LW).zip

    管理员 管理员信息管理 负责人管理 员工信息管理 公告信息管理 小型车收费标准设置(元/每公里) 大卡车收费标准设置(元/吨公里) 收费信息统计,统计小车和卡车收费,按月统计 负责人 个人资料修改 公告查看 小车收费统计(某员工某月统计) 大卡车收费统计(某员工某月统计) 员工 个人资料修改 公告查看 小型车收费登记(车牌号,车辆照片,行使公里数,收费金额,收费日期,收费员,按公里数可以自动计算费用 收费金额=收费标准*公里数) 大卡车金额设置(每吨/元)(车牌号,车辆照片,行使公里数,吨,收费金额,收费日期,收费员, 收费金额=收费标准*吨*公里数 ) 环境说明: 开发语言:Java 框架:ssm,mybatis JDK版本:JDK1.8 数据库:mysql 5.7 数据库工具:Navicat11 开发软件:eclipse/idea Maven包:Maven3.3 服务器:tomcat7

    【图像加密解密】基于matlab Logistic映射和线性反馈移位寄存器组合的图像加密解密【含Matlab源码 9866期】复现.zip

    Matlab领域上传的视频均有对应的完整代码,皆可运行,亲测可用,适合小白; 1、代码压缩包内容 主函数:main.m; 调用函数:其他m文件;无需运行 运行结果效果图; 2、代码运行版本 Matlab 2019b;若运行有误,根据提示修改;若不会,私信博主; 3、运行操作步骤 步骤一:将所有文件放到Matlab的当前文件夹中; 步骤二:双击打开main.m文件; 步骤三:点击运行,等程序运行完得到结果; 4、仿真咨询 如需其他服务,可私信博主; 4.1 博客或资源的完整代码提供 4.2 期刊或参考文献复现 4.3 Matlab程序定制 4.4 科研合作

    Python项目-实例-08 抖音表白.zip

    Python课程设计,含有代码注释,新手也可看懂。毕业设计、期末大作业、课程设计、高分必看,下载下来,简单部署,就可以使用。 包含:项目源码、数据库脚本、软件工具等,该项目可以作为毕设、课程设计使用,前后端代码都在里面。 该系统功能完善、界面美观、操作简单、功能齐全、管理便捷,具有很高的实际应用价值。

Global site tag (gtag.js) - Google Analytics