使用jQuery按下按钮复制一大块HTML代码

时间:2015-06-13 14:10:53

标签: javascript jquery html

我正在尝试建立一个有多项选择题的网站。我想要一个功能,使用户可以通过按下按钮添加问题。按下按钮后,将出现可编辑的MCQ模板。我已经完成了像这样的问题的编码

<div id="mcq">
    <div id="question">
        <p class="Q1" data_opt="A"><b>Q1.</b>What is the next number in the series 1,2,3,...</p>
    </div>

    <div class="options">
        <div id="optList">
            <p id="optId" class="opt ans" data-opt="A">4</p>
            <p id="optId" class="opt" data-opt="B">5</p>
            <p id="optId" class="opt" data-opt="C">6</p>
            <p id="optId" class="opt" data-opt="D">7</p>
        </div>
    </div>

    <div class="stats">
        <ul class="stat_list">
            <li><p class="btn">Like</p></li>
            <li><p class="like_counter">20</p></li>
            <li><p class="done">Check Answer</p></li>
        </ul>
    </div>

</div>

任何人都可以告诉我使用jQuery复制此代码并在其后编辑文本的正确方法。这大大减少了重复编码。在此先感谢!!

1 个答案:

答案 0 :(得分:0)

是的,你应该创建一个片段并注入这样的东西:

var options="";
var frag = ['<div id="optlist">'];
    for(var i=0; i<answers.length; i++){
          options+= '<p id=optId'+i+' class="opt" opt-data="'+anwsers[i].data+'">'+anwsers[i].answer+'</p>';
    }
frag.push(options);
frag.push('</div>');
$(".options").append(frag.join(" "));

另外,你需要制作那些id唯一的optId1,optId2等或使用类