Question

我正在尝试使用jQuery mobile在动态列表中创建动态列表我试图使用item.On("click", callGroups);，但我无法将参数传递给函数。我正在使用jQuery mobile 1.3和jquery 1.8

这是我的ajax代码

<script type="text/javascript" type="text/javascript">


        $(document).ready(function () {

            Greating();
        });

        //  $(document).on('pageinit', function () {
       function callGroups(ID)
       {
       $("#"+ID).append("<ul><li> first</li><li>second item</li> </a></li> ");


       }

        function Greating() {

            $.ajax({

                type: "POST",
                url: "CarService.asmx/GetAllsections",
                data: "{}",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (response) {

                    var sections = response.d;
                    $('#page_body').append("<div data-role='page' id= 'ssaadd'><div>");
                    $.mobile.initializePage();

                    $.each(sections, function (index, section) {

                        //  asd = "listsec" + section.secId;
                        $("#theList").append("<li> <a id = '"+section.secId+"' ><img src='pic/" + section.SecImg + "'> <br /> " + section.SecName + '   ' + section.SecArbName + " <br />" + section.SecArbDiscr + "").on("click", callGroups();


                    });



                    console.log(response);
                },

                error: function (response) {
                    $("#theList").append("<li>error<li>");

                    console.log(response);
                }
            });
        }
    </script>

如何在动态列表中构建动态列表？

Answer 1

您追加方法错误，您要将click事件处理程序添加到循环中的#theList而不是新添加的li，您可以使用appendTo修改代码的方法

$("<li> <a id = '"+section.secId+"' ><img src='pic/" + section.SecImg + "'> <br /> " + section.SecName + '   ' + section.SecArbName + " <br />" + section.SecArbDiscr + "").appendTo('#theList').on("click", callGroups);

将CallGroups更改为

function callGroups(ID) {
    $(this).append("<ul><li> first</li><li>second item</li> </a></li> ");
}

Answer 2

这是我尝试此代码的答案，它正在运行

 $.each(sections, function (index, section) {

                        var asd = section.SecName;
                        $("#theList").append("<li id='" + asd + "'>  <img src='pic/" + section.SecImg + "'> <br /> " + section.SecName + '   ' + section.SecArbName + " <br />" + section.SecArbDiscr + "");
                        $("#"+asd).append("<ul><li >  <img src='pic/" + section.SecImg + "'> <br /> " + section.SecName + '   ' + section.SecArbName + " <br />" + section.SecArbDiscr + "</li></ul></li>");
                    });

项目上的ajax动态列表单击创建新子列表

2 个答案: