util.js介绍及应用

      util.js包含了一些工具函数来帮助你用javascript数据(例如从服务器返回的数据)来更新你的web页面。 你可以在DWR以外使用它，因为它不依赖于DWR的其他部分。你可以下载整个DWR或者单独下载. 4个基本的操作页面的函数：getValue[s]()和setValue[s]()可以操作大部分HTML元素除了table，list和image。getText()可以操作select list。 要修改table可以用addRows()和removeAllRows()。要修改列表(select列表和ul,ol列表)可以用addOptions()和removeAllOptions()。 还有一些其他功能不是DWRUtil的一部分。但它们也很有用，它们可以用来解决一些小问题，但是它们不是对于所有任都通用的。

    

 $();

功能:相当于document.getElementById("id")

参数：标签id的属性值

介结：$() 函数(它是合法的Javascript名字) 是从Protoype偷来的主意。 大略上的讲： $ = document.getElementById。 因为在Ajax程序中，你会需要写很多这样的语句，所以使用 $() 会更简洁。 通过指定的id来查找当前HTML文档中的元素，如果传递给它多个参数，它会返回找到的元素的数组。所有非String类型的参数会被原封不动的返回。这个函数的灵感来至于prototype库，但是它可以在更多的浏览器上运行。 可以看看DWRUtil.toDescriptiveString的演示。 从技术角度来讲他在IE5.0中是不能使用的，因为它使用了Array.push，尽管如此通常它只是用来同engine.js一起工作。如果你不想要engine.js并且在IE5.0中使用，那么你最好为Array.push找个替代品。

  

 

 

DWRUtil.setValue(id, value)

功能：根据第一个参数中指定的id找到相应元素，并根据第二个参数改变其中的值。 这个函数能操作大多数HTML元素包括select(去处当前选项的值而不是文字)、input元素(包括textarea)、div和span。

 

 

addOptions and removeAllOptions

      功能介绍：DWR的一个常遇到的任务就是根据选项填充选择列表。下面的例子就是根据输入填充列表。 下面将介绍 DWRUtil.addOptions() 的几种是用方法。 如果你希望在你更新了select以后，它仍然保持运来的选择，你要像下面这样做：

     var sel = DWRUtil.getValue(id); DWRUtil.removeAllOptions(id); DWRUtil.addOptions(id, ...); DWRUtil.setValue(id, sel);        

 

        如果你想加入一个初始的"Please select..." 选项那么你可以直接加入下面的语句： DWRUtil.addOptions(id, /["Please select ..."]);
    DWRUtil.addOptions有5种模式
    数组: DWRUtil.addOptions(selectid, array) 会创建一堆option，每个option的文字和值都是数组元素中的值。
    对象数组 (指定text): DWRUtil.addOptions(selectid, data, prop) 用每个数组元素创造一个option，option的值和文字都是在prop中指定的对象的属性。
    对象数组 (指定text和value值): DWRUtil.addOptions(selectid, array, valueprop, textprop) 用每个数组元素创造一个option，option的值是对象的valueprop属性， option的文字是对象的textprop属性。
    对象: DWRUtil.addOptions(selectid, map, reverse)用每个属性创建一个option。对象属性名用来作为option的值，对象属性值用来作为属性的文字，这听上去有些不对。但是事实上却是正确的方式。如果reverse参数被设置为true，那么对象属性值用来作为选项的值。
    对象的Map: DWRUtil.addOptions(selectid, map, valueprop, textprop) 用map中的每一个对象创建一个option。用对象的valueprop属性做为option的value，用对象的textprop属性做为option的文字。
    ol 或 ul 列表: DWRUtil.addOptions(ulid, array) 用数组中的元素创建一堆li元素，他们的innerHTML是数组元素中的值。这种模式可以用来创建ul和ol表。

    用法：

 

   if (typeof window["DWRUtil"] == "undefined") {window.DWRUtil = dwr.util;}function getV() {var arraylist1 = ["logo", "csp", "hahalong", "hongniu", "qingsong"];var arraylist2 = [{name:"logo", value:"1"}, {name:"csp", value:"2"}, {name:"qingsong", value:"3"}, {name:"hongniu", value:"4"}, {name:"hahalong", value:"5"}];var arraylist3 = {1:'logo', 2:'csp', 3:'qingsong', 4:'hahalong', 5:'hongniu'};DWRUtil.setValue("username", "logo and csp");var ispan = $("ispan").innerHTML = "javaWeb dwr util.js $";DWRUtil.addOptions('selectid1',arraylist1);DWRUtil.addOptions('selectid2',arraylist2,'name'); //第三个参数是文本 其实value和text都一样DWRUtil.addOptions('selectid3',arraylist2,'name','value'); // 第三个参数是值 第四个参数是文本DWRUtil.addOptions('selectid4',arraylist3); // arraylist3中前面的是值，后面的是文本DWRUtil.addOptions('selectid5',arraylist3,true); //arraylist3中前面的是文本，后面的是值

 

 

 

 DWRUtil.onReturn(event, submitFunction)

功能：定义在输入框中按回车的响应,防止执行submit.

 

 

DWRUtil.getValue(id);

功能:获得指定元素value值

参数: id或name属性值;

注意:该函数只能用于有value属性的元素，DWRUtil.getValue(id)是 setValue()对应的"读版本"。它可以从HTML元素中取出其中的值，而你不用管这个元素是select列表还是一个div。 这个函数能操作大多数HTML元素包括select(去处当前选项的值而不是文字)、input元素(包括textarea)、div和span。

  

 

DWRUtil.getText("elementId")

功能：返回一个select下拉菜单中的text值。

注意：仅适用于select类型的元素。getText(id)和getValue(id)很相似，出了它是为select列表设计的，你可能需要取得显示的文字，而不是当前选项的值。