Question

我想在使用javascript创建的div中使用jQuery标签（http://jsfiddle.net/43FcS/2/）。

现在我正在为我正在工作的商店创建一个商店定位器。我正在使用由Bjorn（http://www.bjornblog.com/web/jquery-store-locator-plugin）创建的jQuery shop locator插件。

当用户点击搜索时，将列出搜索结果（距离输入的地址最近的4家商店）。在每个li中，我想到创建一个带有“shoptab”类的div。在每个div中，我想显示2个选项卡（地址和开放时间），如上面的链接所示。我的javascript使用以下函数创建li：

$('<li />').html("<div class=\"shoptab\"><h2 class=\"loc-name\"> Shop " + storeName + "<\/h2> <ul><li><a href=\"#tabs-1\">Address<\/a><\/li> <li><a href=\"#tabs-2\">Opening hours<\/a><\/li><\/ul> <div id=\"tabs-1\"><p>" + storeAddress1 + "<\/p> <p>" + storeAddress2 + "<\/p> <p>" + storeCity + ", " + storeState + " " + storeZip + "<\/p> <p>" + storePhone + "<\/p> <\/div> <div id=\"tabs-2\"><p>" + storeHours1 + "<\/p> <p>" + storeHours2 + "<\/p> <p>" + storeHours3 + "<\/p> <\/div><\/div>")

我知道我不能使用ids tabs-1和tabs-2，因为它们会被多次使用，但是现在我只是希望它们至少显示出来然后调整代码以给出div的ID 1,2 ，3,4等。

我对jQuery标签的功能与我的shoplocator功能一起写在文档的底部。

$(function() {
        $(".shoptab").tabs();
    });

jQuery ui脚本不会将类应用到shoptab div和ul / li中，我也无法弄清楚如何使它工作。

我希望有了这些信息，你可以帮助我。

Answer 1

我认为问题是在文档中存在必需的html之前调用$(".shoptab").tabs();。

在文档中插入HTML后，即在所有

之后，您应该调用$(".shoptab").tabs();

$('<li />').html("<div class=\"shoptab\"><h2 class=\"loc-name\"> Shop " + storeName + "<\/h2> <ul><li><a href=\"#tabs-1\">Address<\/a><\/li> <li><a href=\"#tabs-2\">Opening hours<\/a><\/li><\/ul> <div id=\"tabs-1\"><p>" + storeAddress1 + "<\/p> <p>" + storeAddress2 + "<\/p> <p>" + storeCity + ", " + storeState + " " + storeZip + "<\/p> <p>" + storePhone + "<\/p> <\/div> <div id=\"tabs-2\"><p>" + storeHours1 + "<\/p> <p>" + storeHours2 + "<\/p> <p>" + storeHours3 + "<\/p> <\/div><\/div>")

已执行

在使用javascript创建的div中添加jQuery选项卡

1 个答案: