如何在jquery中以半小时间隔在选择框中获取时间

时间:2017-07-29 12:59:12

标签: javascript jquery

我没有在23:30选择框中选择。任何人都可以告诉我在选项中添加30分钟间隔的正确方法。

jQuery(document).ready(function() {
  var hr = "00";
  var mi = "00";
  var count = 0;
  for (hr = "0"; hr < 24; hr++) {
    if (hr < 10) {
      apd = "0";
    } else {
      apd = ""
    }
    if (count % 2 == 0) {
      mi = "00";

      jQuery("#bmg_monday_start_hour").append('<option val="' + apd + hr + ':' + mi + '">' + apd + hr + ':' + mi + '</option>');
    } else {
      hr--;
      mi = "30";

      jQuery("#bmg_monday_start_hour").append('<option val="' + apd + hr + ':' + mi + '">' + apd + hr + ':' + mi + '</option>')
    }
    count++;
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div>
  <select name="bmg_monday_start_hour" id="bmg_monday_start_hour" class="form-control bmg-hrs-mins-input"></select>
</div>

4 个答案:

答案 0 :(得分:1)

您可以删除count周围的逻辑。

e.g。

let $select = jQuery("#bmg_monday_start_hour");

for (let hr = 0; hr < 24; hr++) {

  let hrStr = hr.toString().padStart(2, "0") + ":";

  let val = hrStr + "00";
  $select.append('<option val="' + val + '">' + val + '</option>');

  val = hrStr + "30";
  $select.append('<option val="' + val + '">' + val + '</option>')

}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <select name="bmg_monday_start_hour" id="bmg_monday_start_hour" class="form-control bmg-hrs-mins-input"></select>
</div>

答案 1 :(得分:1)

你可以使用hr数组和mi循环遍历hr数组并附加选项

在几行中实现

$(document).ready(function() {
var hr=['00','01','02','03','04','05','06','07','08','09','10','11','12','13','14','15','16','17','18','19','20','21','22','23'];
var mi=['00','30'];
for( i=0;i<hr.length;i++){
$("#bmg_monday_start_hour").append('<option val="' + hr[i]  + ':' + mi[0] + '">'+ hr[i] + ':' + mi[0] + '</option>');									
$("#bmg_monday_start_hour").append('<option val="' + hr[i]  + ':' + mi[1] + '">' + hr[i] + ':' + mi[1] + '</option>');
								}
              })
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
<select name="bmg_monday_start_hour" id="bmg_monday_start_hour" class="form-control bmg-hrs-mins-input">
                        </select>
                        </div>

答案 2 :(得分:1)

&#13;
&#13;
jQuery(document).ready(function () {
    var hr = "00";
    var mi = "00";
    var count = 0;
    var apd = "0";

    for (hr = "0"; hr <= 24; hr++) {
        if (hr <= 10) {
            apd = "0";
        } else {
            apd = "";
        }
        if (count % 2 == 0) {
            mi = "00";

            if (hr != "24" && hr != "10") {

                jQuery("#bmg_monday_start_hour").append('<option val="' + apd + hr + ':' + mi + '">' + apd + hr + ':' + mi + '</option>');

            }
            else if (hr == "10") {

                jQuery("#bmg_monday_start_hour").append('<option val="' + hr + ':' + mi + '">' + hr + ':' + mi + '</option>');

            }

        } else {
            hr--;
            mi = "30";

            jQuery("#bmg_monday_start_hour").append('<option val="' + apd + hr + ':' + mi + '">' + apd + hr + ':' + mi + '</option>')
        }
        count++;
    }
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div>
  <select name="bmg_monday_start_hour" id="bmg_monday_start_hour" class="form-control bmg-hrs-mins-input"></select>
</div>
&#13;
&#13;
&#13;

答案 3 :(得分:0)

for(hr = "0"; hr < 24; hr++) {
    // Lets say hr == 23 here, and following condition is true (thus adding 23:00)
    if(count%2==0) {
        // ...
    }
}

然后下一次迭代将执行hr++,不再小于24

将会有更清洁的解决方案

for(hr = "0"; hr < 24; hr++) {
    if(hr < 10) {
        apd = "0";
    } else {
        apd = ""
    }

    mi = "00";
    jQuery("#bmg_monday_start_hour").append('<option val="' + apd + hr  + ':' + mi + '">' + apd + hr + ':' + mi + '</option>');
    mi = "30";
    jQuery("#bmg_monday_start_hour").append('<option val="' + apd + hr  + ':' + mi + '">' + apd + hr + ':' + mi + '</option>');
}