使用for循环而不是大型的if语句通过jQuery附加信息

Question

我有一个名为bike_main的表，其中包含“ time”和“ id”列，我使用此表使用mySQL获得最繁忙的时间

MySQL的

$query = 'SELECT hour(date) AS h FROM bike_main GROUP BY h ORDER BY count(*) DESC LIMIT 1';
$result = mysql_query($query);
$row = mysql_fetch_assoc($result);

HTML返回17

HTML

<div class="flip">
    <a href="#">
        <div class="flip-front blue circle">
            <h3 id="busierHour"><?php echo $row['h']; ?></h3>
            <p>is the busiest hour</p>
        </div>
        <div class="flip-back blue circle">
            <h3 class="notBusyhour"><?php echo $leastBusyDisplay['h']; ?></h3>
            <p>is the least busiest hour</p>
        </div>
    </a>
</div>

为了使它更加用户友好，我想将值从“ 17”更改为“ 5-6PM”。 由于此数据是通过数据库动态生成的，因此我需要将任何值从1-24更改为它们各自的小时数（例如，19需要为7-8PM，因为当前值17可以随时更改） 。 以下代码有效：

jQuery的

if ($('#busierHour').text() == '17') {
        $('#busierHour').text('5 - 6PM');
} else {
    console.log('hour not logged');
}

但是，我不想让一个很大的if语句通过一个循环运行，该循环将检测该值并返回其各自的值。 我努力了：

JavaScript的

var hour = 1;
var nextHour = hour+1;

while (hour < 24) {
    console.log('hour is ' + hour);
    console.log('next hour is ' + nextHour);

    if ($('#busierHour').text() == hour && hour > 12) {
        console.log('IF STATEMENT RAN!!');
        $('#busierHour').val(hour + '-' + nextHour + ' AM');
    } else if ($('#busierHour').text() == hour && hour > 24) {
        console.log('SECOND RAN');
$('#busierHour').val(hour + '-' + nextHour + ' PM');
    }
    hour++;
    nextHour++;
}

当运行上述JavaScript时，正确返回了变量（小时为1，下一个小时为2，小时为2，下一个小时为3，依此类推），但控制台记录了“ IF STATEMENT RAN !!”。 控制台记录“下一小时是18”之后。 控制台应记录“ SECOND RAN”。 在“ #busierHour”中，任何文本均未更改。

Answer 1

您可以计算出来，例如

$('#busierHour').text(function(_, txt) {
    var hour = parseInt(txt, 10);
    var ampm = 'AM';

    if ( hour > 12 ) {
        ampm = 'PM'    
        hour = hour - 12;
    }

    return hour + ' - ' + (hour+1) +  ampm;
});

如果在输出数据之前用PHP进行操作，这甚至会更加容易

$timestamp = strtotime( $datestring_from_db );
$ampm_date = date("h.i A", $timestamp);

Answer 2

使用关联数组。

$hour = array(1=>'1-2am',2=>'2-3am',3=>'3-4am' .... , 17=>'5-6pm');

<h3 id="busierHour"><?php echo $hour[$row['h']]; ?></h3>

Answer 3

这是一个简单的计算。

var busierHour = parseInt($('#busierHour').text());
var retString = '';

if(busierHour > 12){
   retString = (busierHour - 12) + ' - ' + (busierHour - 11) + 'PM';
}
else{
   retString = (busierHour) + ' - ' + (busierHour + 1) + 'AM';
}

Answer 4

让您的查询格式化结果：

SELECT 
 DATE_FORMAT(date, '%l')+
 '-'+
 DATE_FORMAT(DATE_ADD(date, INTERVAL 1 HOUR), '%l%p') AS h 
FROM bike_main GROUP BY h ORDER BY count(*) DESC LIMIT 1