Question

我有一个动态标签面板，每次用户点击添加按钮时，它都会生成一个新标签。所以我需要增加选项卡窗格的id然后加载数据。我有一些与Jquery ui合作的东西

$("button#add-tab").click(function(e) {
        e.preventDefault();

        var num_tabs = $("div#tabSequence ul li").length + 1;

        var tpl = $('#tabSeq').html();

        $("div#tabSequence ul").append(
            "<li><a data-toggle='tab' href='#tab" + num_tabs + "' >#" + num_tabs + "</a></li>"
        );
        $("div#tabContent").append(
            "<div class='tab-pane' id='tab" + num_tabs + "'>" + tpl + "</div>"

        );

但我必须使用jQuery .load（）API，所以我认为这不会起作用：

 $("div#tabContent").append(
                "<div class='tab-pane' id='tab" + num_tabs + "'>" + tpl + "</div>"

而是尝试做这样的事情但没有成功：

 $("div#tabContent").append(
            $( 'div .tab-pane #tab" + num_tabs + "').load( "sequenceTemplate.html" )
        );

如何让jQuery创建ID为num_tabs的潜水，然后从另一个文件加载（）div？所有SequenceTemplate.html都有一个动态加载的div

Answer 1

＆＃13;

$("#add-tab").click(function(e) {
  e.preventDefault();

  var num_tabs = $("#tabSequence ul li").length + 1;

  $("<li/>", {
    html: "<a>#" + num_tabs + "</a>",
    appendTo: "#tabSequence ul"
  });

  $("<div/>", {
    class : "tab-pane",
    appendTo : "#tabContent",
    load : "http://output.jsbin.com/kivige/1.js"   //you use: "sequenceTemplate.html"
  });
  
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<button id="add-tab">+ Add</button>
<div id="tabSequence"><ul></ul></div>
<div id="tabContent"></div>

＆＃13;

<强> jsBin example

如何在具有动态id的父div中添加Jquery

1 个答案: