jquery mobile 页面加载时采用ajax绑定页面数据

本文介绍如何使用jQuery Mobile结合AJAX动态加载单选框数据，并展示具体的实现代码。通过两个AJAX请求分别获取不同类型的单选框选项，利用jQuery的事件委托确保页面初始化时正确绑定数据。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

jquery mobile 页面加载时采用ajax绑定页面数据。

query mobile单选框radio的动态加载。

$(document).on('pageinit', '#home', function () {
            $.ajax({
                url: 'GetDxmmHandler.ashx',
                dataType: "json",
                async: true,
                success: function (result) {
                    var lastid = "";
                    $.each(result, function (i, row) {
                        lastid = '#rbtn-dxmb-' + row.Id;
                        $('#selectdx').append(
                        '<input type="radio" value=' + row.Id + ' name=rbtn-dxmb id=rbtn-dxmb-' + row.Id + '>' +
                        '<label for=rbtn-dxmb-' + row.Id + ' >' + row.Mc + '</label>');
                    });
                    $("#home").trigger("create");
                    $(lastid).attr("checked", "checked");
                },
                error: function (request, error) {
                    alert('无法连接网络或者返回值错误!');
                }
            });
            //物品类型
            $.ajax({
                url: 'GetWplxHandler.ashx',
                dataType: "json",
                async: true,
                success: function (result) {
                    $.each(result, function (i, row) {
                        //console.log(JSON.stringify(row));
                        $('#wplxfrbtns').append(
                        '<input type="radio" value=' + row.Bm + ' name=rbtn-wplx id=rbtn-wplx-' + row.Id + '>' +
                        '<label for=rbtn-wplx-' + row.Id + ' >' + row.Mc + '</label>');
                    });
                    // $("#wplxfrbtns").checkboxradio("refresh")
                    //$("input[type='radio']").attr("checked", true).checkboxradio("refresh");
                    $("#home").trigger("create");
                },
                error: function (request, error) {
                    alert('无法连接网络或者返回值错误!');
                }
            });
        });