如何将数组项添加到 Jquery

我正在做一些非常简单的事情，一个简短的测验，我试图将我列在二维数组中的项目显示为

。 我尝试使用JS array.join()方法，但它并没有真正做我想要的。 我想将它们放入列表中，然后为每个列表添加一个单选按钮。

我已经对Jquery进行了一次小小的飞跃，所以很多这是我对“语法”的不熟悉。 我浏览了他们的API， $.each ……？ 我确信这就像for语句一样，我不能让它工作而不会崩溃我所拥有的一切。

这是HTML非常有趣的东西。

而且，这里有一些非常复杂的代码。 抓住你的帽子……

 $(document).ready (function () { var array = [["Fee","Fi","Fo"], ["La","Dee","Da"]]; var q = ["
Fee-ing?","La-ing?
"]; var counter = 0; $('.myBtn').on('click', function () { $('#main_ .facts_div').text(q[counter]); $('.facts_div ul').append('' + array[counter]); counter++; if (counter > q.length) { $('#main_ .facts_div').text('You are done with the quiz.'); $('.myBtn').hide(); } }); }); 

Answer 1

尝试

和

 jQuery(function ($) { // var array = [ ["Fee", "Fi", "Fo"], ["La", "Dee", "Da"] ]; var q = ["Fee-ing?", "La-ing?"]; var counter = 0; //cache all the possible values since they are requested multiple times var $facts = $('#main_ .facts_div'), $question = $facts.find('.question'), $ul = $facts.find('ul'), $btn = $('.myBtn'); $btn.on('click', function () { //display the question details only of it is available if (counter < q.length) { $question.text(q[counter]); //create a single string containing all the anwers for the given question - look at the documentation for jQuery.map for details var ansstring = $.map(array[counter], function (value) { return '
' + value + '
' }).join(''); $ul.html(ansstring); counter++; } else { $facts.text('You are done with the quiz.'); $(this).hide(); } }); // }); 

演示： 小提琴

Answer 2

您可以使用$.each迭代array[counter]并为您的选项创建li元素：

 var list = $('.facts_div ul'); $.each(array[counter], function() { $('
').html(' ' + this).appendTo(list); } 

第一个参数是您的数组，第二个参数是执行操作的匿名函数，其中将保存当前元素值。

另外，如果你这样做：

 $('#main_ .facts_div').text(q[counter]); 

你将用q[counter]替换元素的内容，丢失你的ul标签。 在这种情况下，您可以使用prepend方法而不是text来将此文本添加到标记的开头，或者创建一个新元素只是为了保存这段文本。