Question

我有一个页面，其中包含一个动态创建的手风琴，其中包含有关客户的数据。在我有跨度的手风琴的h3标题中，我可以从我的ajax请求中获取数据。问题是所有的手风琴都有一个属于“pcom”类的div。我怎样才能解决特定的“pcom”入级div？我可以使用.find（）从头部获取数据，因为跨度是标头的子节点。这不适用于解决我的div，因为它们不是h3标题的子元素。有什么想法吗？

我的js请求：

    $("#accordion").accordion({
                collapsible: true,
                active: false,
                header: "h3",
                heightStyle: "content",
                activate: function() {

                var claddress = $('.ui-accordion-header-active').find("span.claddress").text();
                var clcity = $('.ui-accordion-header-active').find("span.clcity").text();
                var clprov = $('.ui-accordion-header-active').find("span.clprov").text();

                //if there is no claddress don't bother - (for accordion activate on close)
                if (claddress == '') {
                    //nothing there so do nothing
                    return;
                }
                //if we do have something check the pcom db for a match
                $.ajax({
                    url: "commenter.php",
                    datatype: "json",
                    data: {
                        clAddress: claddress,
                        clCity: clcity,
                        clProv: clprov
                    },
                    success: function(data) {
                        //we have a match now show it
                        //THIS IS WHERE I NEED TO ADDRESS THE pcom DIV IN THE ACCORDION
                    }
                });

            }
            });

编辑：这就是手风琴的构建方式（只显示了ajax的成功部分）

                    success: function(data) {

                if(data == 'null') {
                buildaccordion("<h3>No Results Found</h3><div>No Data to Show.</div>");
                return;
                }

                var hbuild='';
                var tmp = $.parseJSON(data);
                //run a loop to build the HTML for each record
                $.each(tmp, function(i) {
                    //Header
                    hbuild += '<h3 class="sTitle">' + tmp[i].Name + ' - <span class="claddress">' + tmp[i].Address + '</span>, <span class="clcity">' 
                    + tmp[i].City + '</span>, <span class="clprov">' + tmp[i].Prov + '</span> - ' + tmp[i].CallInTime + '</h3>';

                    //Inner
                    hbuild += "<div>";
                    hbuild += '<ul class="menu">';
                    hbuild += '<li><a href="newcall.php?CustID=' + tmp[i].CustID + '">New Call</a></li>';
                    hbuild += '<li><a href="editcall.php?CustID=' + tmp[i].CustID + '">Edit Call</a></li>';
                    hbuild += '<li><a href="viewcall.php?CustID=' + tmp[i].CustID + '">Details</a></li>';
                    hbuild += '</ul>';
                    hbuild += '<div class="spcom">Persistent Comment Here</div>';
                    hbuild += '<div class="acname">Name: ' + tmp[i].Name + ' - <span class="ClientCust">Customer Num:' + tmp[i].ClientCustNum + '</span></div>';
                    hbuild += '<div class="acphone">Phone: ' + tmp[i].Phone + ' Ext#:' + tmp[i].PExt + '</div>';
                    hbuild += '<div class="acaddress">Address: ' + tmp[i].Address + ', ' + tmp[i].City + ', ' + tmp[i].Prov + ', ' + tmp[i].PCode + '</div>';
                    hbuild += '<div class="accontact">Contact: ' + tmp[i].Contact + '</div>';
                    hbuild += '<span class="acbilledto">Billed To: ' + tmp[i].BilledTo + '</span><br>';
                    hbuild += '<div class="acponum">PO Num: ' + tmp[i].PONum + '</div>';
                    hbuild += '<div class="acourpo">OurPO: ' + tmp[i].OurPO + '</div>';
                    hbuild += '<div class="acgivento">Service Provider: ' + tmp[i].GivenTo + '</div>';
                    hbuild += '<div class="acourwo">Accurate WO: ' + tmp[i].OurWO + '</div>';
                    hbuild += '<div class="acourinv">Accurate Invoice: ' + tmp[i].OurInv + '</div>';
                    hbuild += '<div class="acinvamt">Invoice Total: $' + tmp[i].InvAmt + '</div>';
                    hbuild += '<div class="accomments">Call Comments: ' + tmp[i].Comments + '</div>';
                    hbuild += "</div>";
                });
                //send it off to the build
                buildaccordion(hbuild);
                }

现在我可以在创建它时在pcom div中添加一个包含唯一标识符的id（比如客户ID）但是这样做会导致h3头中的id，因此它会得到id在h3标题中，然后引用div。但我想这样做而不会在手风琴的标签中隐藏大量数据。我不得不在另一个页面上这样做，它变得非常混乱和混乱。

感谢您的帮助， NORST

Answer 1

假设标准的HTML结构如下：

<h3><span>Section 1</span></h3>

<div>
    <p>
    Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer
    ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit
    amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut
    odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.
    </p>
</div>

假设您单独定位H3元素，则使用：

$(this).next('div');

如果您需要从与您匹配的班级的跨度中获得该div，那么它将是：

$(this).parent('h3').next('div');

解决jquery ui手风琴儿童div

1 个答案: