jQuery form插件的使用之处理server返回的JSON, XML,HTML数据

使用jQuery form插件可以方便地实现Ajax提交表单数据,同时也可以处理server返回的JSON、XML、HTML数据。下面是处理server返回的Json、XML和HTML数据的详细攻略。

使用jQuery form插件可以方便地实现Ajax提交表单数据,同时也可以处理server返回的JSON、XML、HTML数据。下面是处理server返回的Json、XML和HTML数据的详细攻略。

一、处理server返回的JSON数据

(1)通过Ajax提交表单后,在success回调函数中使用jQuery.form的json解析方法解析返回的JSON数据。

示例代码:

$('#myForm').ajaxForm({
    url: '/submit',
    type: 'post',
    dataType: 'json',
    success: function(data) {
        //解析返回的JSON数据,取出需要的值
        var result = data.result;
        var message = data.message;
        //处理数据
        //......
    }
});

(2)JSON数据解析完后,可以根据需要使用解析后的数据进行其他的处理,如显示提示信息等。

二、处理server返回的XML数据

(1)同上,通过Ajax提交表单后,在success回调函数中使用jQuery.form的XML解析方法解析返回的XML数据。

示例代码:

$('#myForm').ajaxForm({
    url: '/submit',
    type: 'post',
    dataType: 'xml',
    success: function(data) {
        //解析返回的XML数据,取出需要的值
        var result = $(data).find('result').text();
        var message = $(data).find('message').text();
        //处理数据
        //......
    }
});

(2)XML数据解析完后,可以根据需要使用解析后的数据进行其他的处理,如显示提示信息等。

三、处理server返回的HTML数据

(1)通过Ajax提交表单后,在success回调函数中使用jQuery.form的html解析方法解析返回的HTML数据。

示例代码:

$('#myForm').ajaxForm({
    url: '/submit',
    type: 'post',
    dataType: 'html',
    success: function(data) {
        //解析返回的HTML数据,取出需要的值
        var result = $(data).find('#result').html();
        var message = $(data).find('#message').html();
        //处理数据
        //......
    }
});

(2)HTML数据解析完后,可以根据需要使用解析后的数据进行其他的处理,如显示提示信息等。

综上所述,使用jQuery.form插件可以方便地实现Ajax提交表单数据,并且可以处理server返回的JSON、XML、HTML数据,以实现更加丰富的交互体验。

本文标题为:jQuery form插件的使用之处理server返回的JSON, XML,HTML数据

基础教程推荐