Question

我正在一个网站上工作，其中一个人可以提出一系列问题。我希望用户可以添加他们想要的许多问题，以及每个问题的任何数量的选项。当页面加载时，它将显示一个问题，一个选项 - 文本框，四个按钮，一个用于添加新选项，一个用于添加新问题，以及用于删除问题（带选项）或单个选项的按钮

使用普通的javascript，我想出了一个解决方案，在添加文本之前，必须单击按钮的次数与想要的问题/选项的数量相对应。每次单击按钮时，文本框中的值都将被删除。

function addQuestion() {
numberOfQuestions++;
var container = document.getElementById("container");
container.innerHTML += (...);
}

我怎么能用jQuery改进呢？我测试了这个：

$("button#newQuestion")
    .click(
            function() {
                numberOfQuestions++;
                var container = document
                        .getElementById("container");
                container.append(...);
            });

提前致谢！

Answer 1

在jQuery中，这可能是：

numberOfQuestions=0;
$("button#newQuestion").click(function() {
  numberOfQuestions++;
  $("#container").append('<li>'+numberOfQuestions+'</li>');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button  id="newQuestion">Add Question</button>
<ul id="container">
  
</ul>

Answer 2

HTML代码

<div id="container"></div> <button id="newQuestion">newQ</button>

jQuery代码 $(document).ready(function(){ var NOQ = $("#container").find(".q").length; $("#newQuestion").click(function() { NOQ++; $("#container").append("<div id='q"+NOQ+"' class='q'>Question "+NOQ+"?</div>"); }); });

的jsfiddle： http://jsfiddle.net/rL6xmdfh/3/

使用jQuery追加新元素

2 个答案: