动态生成网格样式问题

Dynamic generation grid style issue

本文关键字：样式 问题 网格 动态      更新时间：2023-09-26

在jQuery mobile（1.3.3版）中，我试图动态生成网格块，并将其附加到网格中，导致样式问题。UI块像一样附加

$("#grid").append(s1).trigger("create");

以下是解释这个问题的JSFiddle。

var a116 = {
   name: 'text',
   city: 'text',
   number: "number"
};
var a117 = {
   firstname: 'text',
   lastname: 'text'
};

function getValues() {
   var formTitle = $("#readselectval").val();
   $("#grid").html("");
   switch (formTitle) {
    case "116":
        var a1 = Object.keys(a116);
        for (var i = 0; i < a1.length; i++) {
            var s1 = '<div class="ui-block-a">' + createLabel(a1[i]) + '' + createInputForm(a1[i], a116[a1[i]]); + '</div>';
            $("#grid").append(s1).trigger("create");
            i++;
            s2 = '<div class="ui-block-b"></div>';
            $("#grid").append(s2).trigger("create");
            s3 = '<div class="ui-block-c">' + createLabel(a1[i]) + '' + createInputForm(a1[i], a116[a1[i]]); + '</div>';
            if (a1[i]) {
                $("#grid").append(s3).trigger("create");
            }
        }
        break;
    case "117":
        var a1 = Object.keys(a117);
        //alert(a1.length)
        for (var i = 0; i < a1.length; i++) {
            var s1 = '<div class="ui-block-a">' + createLabel(a1[i]) + '' + createInputForm(a1[i], a117[a1[i]]); + '</div>';
            $("#grid").append(s1).trigger("create");
            i++;
            //alert(a117[a1[i]])
            s2 = '<div class="ui-block-b"></div>';
            $("#grid").append(s2).trigger("create");
            s3 = '<div class="ui-block-c">' + createLabel(a1[i]) + '' + createInputForm(a1[i], a117[a1[i]]); + '</div>';
            $("#grid").append(s3).trigger("create");
        }
        break;
   }
}
相关文章：