1. 程式人生 > >前端js 實現Html標籤統一賦值和取值 等通用方法

前端js 實現Html標籤統一賦值和取值 等通用方法

通常我們獲取Html頁面中某個標籤的值,需要通過Id標籤一個一個去獲取,當頁面需要獲取的值很多時,這樣的工作無疑是枯燥且麻煩的,這時候就需要我們寫一些用於偷懶的小方法了。總結方法如下:

var util = {
       init: null
};
util.init = function (){

};

/**
 * 自定義js檔案   用於賦值
 * 把資料繫結到物件名稱為modelName的控制元件上
 * args:
 *      modelName: 物件名稱
 *      dataObj: 資料物件
 * example: 
 *      <input type="text"
name="advModel.name" /> * <input type="text" name="advModel.age" /> * bindData("advModel", {"name" : "zhangsan", "age" : 34}); **/ util.bindData = function (modelName, dataObj) { debugger; var tagArray = $("[name^=" + modelName + "]"); var len = tagArray.length; for (var i = 0
; i < len; i++) { var tagObj = tagArray[i]; var name = $(tagObj).attr("name"); var tagName = tagObj.tagName; var type = tagObj.type; if (name == undefined) { continue; } var dataKey = name.substring(name.indexOf(".") + 1); var dataValue = dataObj[dataKey]; if
(dataValue == null || dataValue == undefined) { continue; } tagName = tagName.toUpperCase(); if (tagName == "INPUT") { type = type.toUpperCase(); if (type == "TEXT" || type == "HIDDEN") { var comboObj = $("#" + dataKey); //var comboObj = $("[name='" + name + "']"); if (comboObj != null && comboObj != undefined && comboObj.length == 1) { var clazz = comboObj.attr("class"); if (util.assert.isEmpty(clazz) && (type == "TEXT"||type == "HIDDEN")) { comboObj.val(dataValue); } else if (clazz.indexOf("datebox-f") !== -1) { comboObj.datebox("setValue", dataValue); } else if (clazz.indexOf("numberbox-f") !== -1) { comboObj.numberbox("setValue", dataValue); continue; } else if (clazz == "combobox-f combo-f" || clazz == "combo-value") { //$("[name='" + name + "']").combobox("setValue", dataValue); //$("[comboname='" + name + "']").combobox("setValue", dataValue); comboObj.combobox("setValue", dataValue); } } tagObj.value = dataValue; } if (type == "RADIO") { if (tagObj.value == dataValue) { tagObj.checked = true; } } if (type == "CHECKBOX") { for (var m = 0; m < dataValue.length; m++) { var chkValue = dataValue[m]; if (tagObj.value == chkValue) { tagObj.checked = true; } } } } else if (tagName == "SELECT") { } else if (tagName == "TEXTAREA") { tagObj.value = dataValue; } else if (tagName == "SPAN" || tagName == "DIV" || tagName == 'TD') { tagObj.innerHTML = dataValue; } } }; /** * 根據model名把表單中的資料轉換為物件 * args: * modelName 物件的名稱 * example: * <input type="text" name="userModel.name" /> * <input type="text" name="userModel.age" /> * var userModel =transferModel("userModel"); **/ util.transferModel = function (modelName) { var tagArray = $("[name^=" + modelName + "]"); var len = tagArray.length; var dataObj = {}; for (var i = 0; i < len; i++) { var tagObj = tagArray[i]; var name = $(tagObj).attr("name"); var tagName = tagObj.tagName; var type = tagObj.type; if (name == undefined) { continue; } var dataKey = name.substring(name.indexOf(".") + 1); tagName = tagName.toUpperCase(); if (tagName == "TEXTAREA") { dataObj[dataKey] = tagObj.value; } else if (tagName == "DIV") { dataObj[dataKey] = $("#" + dataKey).html(); } if (tagName == "INPUT") { type = type.toUpperCase(); if (type == "TEXT" || type == "HIDDEN") { dataObj[dataKey] = tagObj.value; } if (type == "RADIO") { if (tagObj.checked) { dataObj[dataKey] = tagObj.value; } } if (type == "CHECKBOX") { if (tagObj.checked) { if (dataObj[dataKey] != undefined && dataObj[dataKey] != null) { var chkArray = dataObj[dataKey]; chkArray.push(tagObj.value); dataObj[dataKey] = chkValArray; } else { var chkValArray = []; chkValArray.push(tagObj.value); dataObj[dataKey] = chkValArray; } } } } } return dataObj; }; //util.assert.isEmpty() //util.assert.isNotEmpty() util.assert = { isBoolean: function (G) { return (typeof G === "boolean"); }, //判斷字串是否由數字組成,則使用RegexHelper的digitMatch //或使用isFinite isNumber: function (G) { return (typeof G === "number" && isFinite(G)); }, isString: function (G) { return (typeof G === "string" || G.constructor == String); }, isFunction: function (G) { var A = {}; return (A.toString.apply(G) === A.toString.apply(Function)); }, isArray: function (G) { return Object.prototype.toString.call(G) === "[object Array]"; }, isObject: function (G) { return (G && (typeof G === "object" || this.isFunction(G)) || false); }, isDefined: function (v) { return typeof v !== 'undefined'; }, isNotDefined: function (v) { return (!util.assert.isDefined(v)); }, /*無法判斷物件或陣列為空,可以用來判斷變數是否為空*/ isEmpty: function (v, allowBlank) { return v === null || v === undefined || ((util.assert.isArray(v) && !v.length)) || (!allowBlank ? v === '' : false); }, isNotEmpty: function (v, allowBlank) { return !util.assert.isEmpty(v, allowBlank); } }; $(document).ready(function () { util.init(); }); ... prompt'''