在jQuery中 關(guān)于json空對(duì)象篩選替換
一個(gè)json object,并且可能包含一些空值或者空字符串,在頁(yè)面顯示的時(shí)候希望遇到空值顯示“N/A”,但是有一部分值是允許空值的。因此希望通過(guò)篩選將空值設(shè)為“N/A”.例如希望學(xué)生的“age”和“score”如果為空顯示“N/A”,而“sex”或者“comment”為空則不做處理。
var student = {
"name" : "Guo",
"sex" : "",
"age" : "",
"num ": 01,
"scores" : [
{
"subject" : "English",
"score" : 50,
"comment" : ""
},
{
"subject" : "Computer",
"score" : "",
"comment" : "absent"
}
]
};
var exclude = ["sex", "comment"];
// method 1 to validate obj
validateObj1 = function(obj, excluded){
var value;
for(var key in obj){
value = obj[key];
if($.isArray(value)){
obj = validateArray1(obj, key, excluded);
}else if(($.inArray(key, excluded) == -1) && ($.isBlank(value))){
obj[key] = "N/A";
}
}
return obj;
}
validateArray1 = function(obj, key, excluded){
var subValue;
for(var i = 0, length = obj[key].length; i < length; i++){
for(var subKey in obj[key][i]){
subValue = obj[key][i][subKey];
if(($.inArray(subKey, excluded) == -1) && ($.isBlank(subValue))){
obj[key][i][subKey] = "N/A";
}
}
}
return obj;
}
// method 2 to validate obj
validateObj2 = function(obj, excluded){
$.each(obj ,function(key, value){
if($.isArray(value)){
obj = validateArray2(obj, key, excluded);
}else if(isInvalid(key, value, excluded)){
obj[key] = "N/A";
}
});
return obj;
}
validateArray2 = function(obj, key, excluded){
for(var i = 0, length = obj[key].length; i < length; i++){
$.each(obj[key][i] ,function(subKey, subValue){
if(isInvalid(subKey, subValue, excluded)){
obj[key][i][subKey] = "N/A";
}
});
}
return obj;
}
isInvalid = function(key, value, excluded){
return (($.inArray(key, excluded) == -1) && ($.isBlank(value))) ? true : false;
}
$.isBlank = function(obj){
return(!obj || $.trim(obj) === "");
};
Method 1 結(jié)果
Method 2 結(jié)果
- jQuery+json實(shí)現(xiàn)動(dòng)態(tài)創(chuàng)建復(fù)雜表格table的方法
- vue.js表格組件開(kāi)發(fā)的實(shí)例詳解
- 在web中js實(shí)現(xiàn)類似excel的表格控件
- JS表格組件BootstrapTable行內(nèi)編輯解決方案x-editable
- JS對(duì)HTML表格進(jìn)行增刪改操作
- Angularjs實(shí)現(xiàn)帶查找篩選功能的select下拉框示例代碼
- jquery遍歷篩選數(shù)組的幾種方法和遍歷解析json對(duì)象
- JS Jquery 遍歷,篩選頁(yè)面元素 自動(dòng)完成(實(shí)現(xiàn)代碼)
- 一個(gè)用javascript寫的select支持上下鍵、首字母篩選以及回車取值的功能
- js實(shí)現(xiàn)表格篩選功能
相關(guān)文章
TimergliderJS 一個(gè)基于jQuery的時(shí)間軸插件
Timeglider JS是一個(gè)由javascript支持縮放,數(shù)據(jù)驅(qū)動(dòng)的時(shí)間軸組件。非常適合顯示項(xiàng)目歷史,項(xiàng)目計(jì)劃及其其它需要顯示歷史的項(xiàng)目2011-12-12jQuery EasyUI Accordion可伸縮面板組件使用詳解
這篇文章主要為大家詳細(xì)介紹了jQuery EasyUI Accordion可伸縮面板組件的使用方法,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-02-02jQuery使用zTree插件實(shí)現(xiàn)樹(shù)形菜單和異步加載
這篇文章主要介紹了jQuery使用zTree插件實(shí)現(xiàn)樹(shù)形菜單和異步加載的相關(guān)方法,感興趣的小伙伴們可以參考一下2016-02-02jquery 抽獎(jiǎng)小程序?qū)崿F(xiàn)代碼
這篇文章主要介紹了jquery 抽獎(jiǎng)小程序的相關(guān)資料,這里提供了詳細(xì)的思路及實(shí)現(xiàn)代碼和實(shí)現(xiàn)效果圖,需要的朋友可以參考下2016-10-10jQuery+Ajax+PHP+Mysql實(shí)現(xiàn)分頁(yè)顯示數(shù)據(jù)實(shí)例講解
這是一個(gè)典型的Ajax應(yīng)用,在頁(yè)面上,您只需要點(diǎn)擊“下一頁(yè)”,數(shù)據(jù)區(qū)將自動(dòng)加載對(duì)應(yīng)頁(yè)碼的數(shù)據(jù),重新刷新數(shù)據(jù)區(qū)。類似的效果在很多網(wǎng)站上應(yīng)用,尤其在一些需要展示大量圖片數(shù)據(jù)的網(wǎng)頁(yè)如淘寶商品列表頁(yè),Ajax分頁(yè)效果讓您的網(wǎng)站數(shù)據(jù)加載顯得非常流暢。2015-09-09jQuery實(shí)現(xiàn)的五星點(diǎn)評(píng)功能【案例】
這篇文章主要介紹了jQuery實(shí)現(xiàn)的五星點(diǎn)評(píng)功能,結(jié)合具體實(shí)例形式分析了jQuery事件響應(yīng)及頁(yè)面元素屬性動(dòng)態(tài)操作實(shí)現(xiàn)五星點(diǎn)評(píng)功能相關(guān)操作技巧,需要的朋友可以參考下2019-02-02