jQuery和从开始和结束值动态生成的表

我想使用jQuery在html表单上使用滑块。 滑块需要00:00和23:55之间的值，并且必须处理它的开始和结束时间。 从幻灯片生成的两个值中，需要生成一个表（我假设使用某种for循环），开始时间和结束时间之间的所有时间以五个小步骤的增量显示。

另一种方法是使用两个具有开始和结束值的选择菜单（第二个必须动态生成，我假设最终用户无法在开始时间之前设置完成时间）。

我更喜欢在jQuery中使用逻辑，因为应用程序的大小是jQuery。 如果有人可以帮助甚至建议从哪里开始，我将不胜感激。

担

UPDATE

好吧，我已经设法让滑块使用jQuery UI现在我需要做的就是获取生成的值并循环遍历它以生成一个包含两个值之间所有时间的表：

var startTime; var endTime; $("#slider-range").slider({ range: true, min: 0, max: 1439, values: [540, 1020], step:5, slide: slideTime, /*change: */ }); function slideTime(event, ui){ var minutes0 = parseInt($("#slider-range").slider("values", 0) % 60); var hours0 = parseInt($("#slider-range").slider("values", 0) / 60 % 24); var minutes1 = parseInt($("#slider-range").slider("values", 1) % 60); var hours1 = parseInt($("#slider-range").slider("values", 1) / 60 % 24); startTime = getTime(hours0, minutes0); endTime = getTime(hours1, minutes1); $("#time").html('Opening time: ' + startTime + '
 Closing time: ' + endTime); } function getTime(hours, minutes) { minutes = minutes + ""; if (hours == 12) { hours = 12; } if (hours > 12) { hours = hours ; } if (minutes.length == 1) { minutes = "0" + minutes; } return hours + ":" + minutes ; } slideTime(); 

这里有一个很好的小教程，可以让它与时俱进： 使用jQuery UI Slider来选择一个时间范围

现在，如果有人可以帮我在表格中输出时间，我们将不胜感激;-D

担

再次更新

好了，现在几乎已经完成，我已经从滑块创建了表格，现在我想要做的就是从下拉框中将值传递给复选框。 因此，例如，如果有人选择列表中的第3个值，则应选择每个第三个复选框。 我认为它会像nth-child选择器一样容易，但3的测试值似乎不起作用

任何想法的家伙？ 源代码在这里和测试示例在这里： 滑块测试 ，你可以看到我试图传递第3选择但代码不起作用。 如果我将$（’。chx：nth-​​child（3）’）更改为$（’。chx：odd’）或$（’。chx：even’），但这不会有任何好处，因为该值是动态的产生

      $(document).ready(function(){ var startTime; var endTime; $("#slider-range").slider({ range: true, min: 0, max: 1439, values: [540, 1020], step:5, slide: slideTime, /*change: */ }); function slideTime(event, ui){ var minutes0 = parseInt($("#slider-range").slider("values", 0) % 60); var hours0 = parseInt($("#slider-range").slider("values", 0) / 60 % 24); var minutes1 = parseInt($("#slider-range").slider("values", 1) % 60); var hours1 = parseInt($("#slider-range").slider("values", 1) / 60 % 24); startTime = getTime(hours0, minutes0); endTime = getTime(hours1, minutes1); $("#time").html('Opening time: ' + startTime + '
 Closing time: ' + endTime); } function getTime(hours, minutes) { minutes = minutes + ""; if (hours == 12) { hours = 12; } if (hours > 12) { hours = hours ; } if (minutes.length == 1) { minutes = "0" + minutes; } return hours + ":" + minutes ; } function getTimeloop(minutesloop) { minutesloop = minutesloop + ""; if (minutesloop.length == 1) { minutesloop = "0" + minutesloop; } return minutesloop ; } slideTime(); $('#generateTable').click(function(){ var startLoop = parseInt($("#slider-range").slider("values", 0)); var endLoop = parseInt($("#slider-range").slider("values", 1)); $('#table').remove(); $('').insertAfter('#generateTable'); for(i = startLoop; i < endLoop; i+=5) { $('').appendTo('#table'); } $('.chx:nth-child(3)').attr('checked', true); }); });   #slider-range{width:800px;} #slider-range,#time{margin:10px;display:block;}  
  05 10 15 20 25 30 35 40 45 50 55 60 
 生成表 








 
	
Answer 1
		      	
 哇你做了很多没有答案的工作！ 我建议只是迭代每个复选框并使用模运算来确定是否应该设置它。 例如。 
 var i=0; $('.chx').each(function(){ $(this).attr('checked',(i % period==0)); i++; }); 
 或类似的。 每个复选框的period为1，其他每个复选2等…