Question

大家好我正在构建一个for循环，它基本上生成一个动态选择选项表单。

一切正常，直到我尝试使用十进制值作为增量器。

例如，正常的循环是这样的：

for(i =0; i <= 10; i++){
// do some code
}

我面临的问题是所有被放入的东西都是动态的，包括可能需要用十进制数字递增的增量！

例如，它可能需要这个：

for(i =0; i <= 10.5;i+= 1.5){
//do some code
}

现在的问题是，一切都是动态的，所以实际的最终代码如下所示：

for(thei = 0; thei <= calchours; thei += +thetype){

}

如果＆＃34; thetype＆＃34;只有1，但只要它1.5，它只会在退出之前循环几次。

以下是我要做的示例代码：

示例Html代码：

<select class="form-control" id="bookingtype" name="bookingtype">
    <option value="1" selected="">Hourly Bookings</option>
    <option value="1.5">1 Hour Bookings With 30 Minute Intervals</option>
</select>

<select class="form-control" id="timefrom" name="timefrom">
    <option value="N/A" selected="">N/A</option>
    <option value="24">00:00</option>
    <option value="01">01:00</option>
    <option value="02">02:00</option>
    <option value="03">03:00</option>
    <option value="04">04:00</option>
    <option value="05">05:00</option>
    <option value="06">06:00</option>
    <option value="07">07:00</option>
    <option value="08">08:00</option>
    <option value="09" selected="selected">09:00</option>
    <option value="10">10:00</option>
    <option value="11">11:00</option>
    <option value="12">12:00</option>
    <option value="13">13:00</option>
    <option value="14">14:00</option>
    <option value="15">15:00</option>
    <option value="16">16:00</option>
    <option value="17">17:00</option>
    <option value="18">18:00</option>
    <option value="19">19:00</option>
    <option value="20">20:00</option>
    <option value="21">21:00</option>
    <option value="22">22:00</option>
    <option value="23">23:00</option>
</select>

<select class="form-control" id="timeto" name="timeto">
    <option value="N/A" selected="">N/A</option>
    <option value="24">00:00</option>
    <option value="00.5">00:30</option>
    <option value="01">01:00</option>
    <option value="01.5">01:30</option>
    <option value="02">02:00</option>
    <option value="02.5">02:30</option>
    <option value="03">03:00</option>
    <option value="03.5">03:30</option>
    <option value="04">04:00</option>
    <option value="04.5">04:30</option>
    <option value="05">05:00</option>
    <option value="05.5">05:30</option>
    <option value="06">06:00</option>
    <option value="06.5">06:30</option>
    <option value="07">07:00</option>
    <option value="07.5">07:30</option>
    <option value="08">08:00</option>
    <option value="08.5">08:30</option>
    <option value="09">09:00</option>
    <option value="09.5">09:30</option>
    <option value="10">10:00</option>
    <option value="10.5">10:30</option>
    <option value="11">11:00</option>
    <option value="11.5">11:30</option>
    <option value="12">12:00</option>
    <option value="12.5">12:30</option>
    <option value="13">13:00</option>
    <option value="13.5">13:30</option>
    <option value="14">14:00</option>
    <option value="14.5">14:30</option>
    <option value="15">15:00</option>
    <option value="15.5">15:30</option>
    <option value="16">16:00</option>
    <option value="16.5">16:30</option>
    <option value="17" selected="selected">17:00</option>
    <option value="17.5">17:30</option>
    <option value="18">18:00</option>
    <option value="18.5">18:30</option>
    <option value="19">19:00</option>
    <option value="19.5">19:30</option>
    <option value="20">20:00</option>
    <option value="20.5">20:30</option>
    <option value="21">21:00</option>
    <option value="21.5">21:30</option>
    <option value="22">22:00</option>
    <option value="22.5">22:30</option>
    <option value="23">23:00</option>
    <option value="23.5">23:30</option>
</select>

<input id="dinnerswitch" type="checkbox" value="1">

<div id="dinnerhourdiv" class="form-group">
    <label class="col-sm-3 control-label">Select Which Hour You Would Like To Have Off?</label>
    <div class="col-sm-2" id="showdinnerhours"></div>
</div>

示例Javascript

jQuery(document).read(function(){

    jQuery('#dinnerswitch').change(function(){

        if(jQuery(this).is(':checked')) {
            jQuery(this).val(1);
        };
        if(jQuery(this).is(':checked') == false) {
            jQuery(this).val(0);
        };

        var dinnerid = jQuery('#dinnerswitch').val();

        var thestart = jQuery('#timefrom').val();
        var theend = jQuery('#timeto').val();
        var thetype = jQuery('#bookingtype').val();
        var thei = 0;
        var doi = '';

        var calchours = ((theend - thestart) / thetype);

        var calstart = '';
        var calend = '';
        var enterhours = '';
        var addingnumbers = 0;


        for(thei = 0; thei <= calchours; thei+= +thetype){

            calstart = +thestart + +thei;

            if(calstart < 12){
                calend = calstart + ' AM';
            } else {
                calend = calstart + ' PM';
            }

            calend = calend.replace('.5', ':30');

            enterhours += '<option value="' + addingnumbers + '">' + calend + '</option>';

            addingnumbers = +addingnumbers + 1;

        }

        if(dinnerid == 1){

            jQuery('#showdinnerhours').html('<select class="form-control" name="dinnerhour" id="dinnerhour">' + enterhours + '</select>');
            jQuery('#dinnerhourdiv').removeClass('hidden');

        } else {

            jQuery('#showdinnerhours').html('');
            jQuery('#dinnerhourdiv').addClass('hidden');

        }

    });

});

Answer 1

你的逻辑完全按照你的要求行事！

当选择“间隔30分钟的1小时预订”，并从9:00开始到17:00结束时，您的变量具有以下值：

thestart = 09
theend = 17
thetype = 1.5

因此

calchours = 5.333333或((17-9)/1.5)

你的循环从零开始，一直持续到calchours并递增1.5。因此，循环仅运行4次，为您提供动态选择9：00,10：30,12＆amp;的条目。 13:30。

这与“数学”完全一致，我通过“调试”的魔力得出了这些结论。检查控制台：http://jsfiddle.net/7x82d66h/

有一个javascript for loop + = decimal变量的问题

1 个答案: