Jquery是一種JavaScript框架,它極大地方便了前端程序員的工作。在Web應(yīng)用中,前端經(jīng)常需要將頁面控件轉(zhuǎn)換為JSON格式,方便數(shù)據(jù)傳輸與處理。下面介紹一些Jquery函數(shù)實(shí)現(xiàn)該功能。
// 獲取input、textarea等表單元素的JSON值
var formData = $('form').serializeArray();
var jsonData = {};
$.each(formData, function() {
if (jsonData[this.name]) {
if (!jsonData[this.name].push) {
jsonData[this.name] = [jsonData[this.name]];
}
jsonData[this.name].push(this.value || '');
} else {
jsonData[this.name] = this.value || '';
}
});
// 獲取select、radio、checkbox等表單元素的JSON值
$('select,radio,checkbox').change(function(){
var jsonData = {};
$('form').find('select,radio,checkbox').each(function(){
jsonData[$(this).attr('name')] = $(this).val();
});
console.log(jsonData);
});
以上代碼實(shí)現(xiàn)了兩個(gè)功能,一個(gè)是獲取所有表單元素的JSON值,另一個(gè)是實(shí)時(shí)監(jiān)測(cè)某些表單元素的變化并輸出JSON值。
總結(jié)一下,利用Jquery可以非常方便地將頁面中各種表單元素的值轉(zhuǎn)換為JSON格式,并且可以實(shí)時(shí)監(jiān)測(cè)其變化。這對(duì)于前端工程師來說是一大福音,可以大大提高開發(fā)效率。