Question

前一段时间我发布了一个关于jquery滑块here

的问题

这现在有点好处，但我现在需要将它包装在一周中每一天的函数中，这样我就可以传递值，因为某些值是硬编码的。我试过这样做，Firebugs告诉我滑块未定义。

我想要做的就是为一周中的每一天调用函数七次并传入滑块的id，传递包含时间的div的id，包含生成的表的div的id，表本身的id和按钮的id。

目前的代码是：

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('<p>Opening time: ' + startTime + '</p><p>Closing time: ' + endTime + '</p>');
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;
    }
returnminuetsloop;
}                                   }   
                                        slideTime();
                                        $('#btnUpdatetable').click(function(){
var startLoop = parseInt($("#slider-range").slider("values", 0));
var endLoop = parseInt($("#slider-range").slider("values", 1));
$('#bookingTimesTable').remove();
$('<table id="bookingTimesTable">').appendTo('#generatedResultTable');
for(i = startLoop; i < endLoop; i+=5)
{
$('<tr><td style="width:145px; padding-left: 10px;">' + parseInt(i/ 60 % 24) + ':' +  getTimeloop(parseInt(i % 60)) + '</td><td style="padding-left: 10px;" ><input class="chx" name="' + parseInt(i/ 60 % 24) + ':' +  getTimeloop(parseInt(i % 60)) + '" type="checkbox" value="' + parseInt(i/ 60 % 24) + ':' +  getTimeloop(parseInt(i % 60)) + '" /></td></tr>').appendTo('#bookingTimesTable');
}
var i=0;
var period = $('#cboBooking').val();        

$('.chx').each(function(){
  $(this).attr('checked',(i % period ==0));
  i++;
});
$('#bookingTimesTable tr:odd').css('background','#dedede');
});

如果你可以帮助我，这将是伟大的！它在一个标签式界面上实现了一周七天，我真的想让它快速运行

丹

Answer 1

快速记录一下帮助...将整个事物包装在构造函数中，这将在所有包含的变量和函数上形成一个闭包。然后传入你想重新定义的函数参数：

function BookingSlider (sliderId, timesDivId, tableDivId, tableId, buttonId) {
    // your code
}

使用此构造函数实例化BookingSlider的新实例，并传入适当的值：

var bsMonday = new BookingSlider('slider-range', 'time', 'generatedResultTable', 'bookingTimesTable', 'btnUpdatetable');

确保用函数中的相应参数替换所有字符串常量：

'#btnUpdatetable'

变为

'#' + buttonId

帮我把滑块包装成我可以调用的函数

1 个答案: