jQueryのelse if条件のelse条件を指定します

Question

私のクライアントは自分のサイトでオンライン注文を提供していますが、毎日彼の配送時間が異なります。彼は外部サイトのパーティソリューションを使用してオンライン注文を処理しており、オンライン注文が利用可能でない限り、そのユーザーをそのサイトに転送したくありません。そこで私はモーダルアラートボックスを作成しました。このアラートボックスをクリックすると、外部サイトへのリンクでオンライン注文が利用可能であるというメッセージが表示されます。コードではnew Date().getDay();を使用して現在の日を特定し、次に一連のif & else ifステートメントを使用して正しいモーダルを表示します。これはすべて動作しますが、異なる配達時間があるので、ifの声明には、翌日の配達時間のモーダルを示す異なるメッセージでelseの条件を示す必要があります。

私が言ったように、これは粗末なものであり、多くのコード行の数が少なくなる可能性があります。しかし、すべてのifに対してelse条件を追加することができれば、この時点で私は本当に必要なのです。ありがとうございました。

/ELSE if文

var monStartTime = '4:00 PM'; 
var monEndTime = '8:00 PM'; 

var teuStartTime = '11:00 AM'; 
var teuEndTime = '9:00 PM'; 

var wedStartTime = '11:00 AM'; 
var wedEndTime = '9:00 PM'; 

... 

var curr_day = new Date().getDay(); 
var curr_time = getval(); 

if (curr_day == '1' && get24Hr(curr_time) > get24Hr(monStartTime) && get24Hr(curr_time) < get24Hr(monEndTime)) { 
    document.querySelector('#alert-success').onclick = function() { 
     $.sweetModal({ 
      content: '<h2>Online Ordering is Available!</h2>' + 
       'Please click the button below to begin your online order.' + 
       '<div class="sweet-modal-buttons"><a href="http://pizzospizzeria.hungerrush.com" target="_blank" class="button greenB">Start Order</a></div>', 
      // icon: $.sweetModal.ICON_SUCCESS 
     }); 
    }; 
} else if (curr_day == '2' && get24Hr(curr_time) > get24Hr(teuStartTime) && get24Hr(curr_time) < get24Hr(teuEndTime)) { 
    document.querySelector('#alert-success').onclick = function() { 
     $.sweetModal({ 
      content: '<h2>Online Ordering is Available!</h2>' + 
       'Please click the button below to begin your online order.' + 
       '<div class="sweet-modal-buttons"><a href="http://pizzospizzeria.hungerrush.com" target="_blank" class="button greenB">Start Order</a></div>', 
      // icon: $.sweetModal.ICON_SUCCESS 
     }); 
    }; 
} else if ... 

は、私はあなたがすべてのコードで同じことを繰り返している

... 

} else { 
    document.querySelector('#alert-success').onclick = function() { 
     $.sweetModal({ 
      content: '<h2>Online Ordering is Not Available</h2>' + 
       'Online ordering will be available again tomorrow from 11:00am to 9:00pm', 
      // icon: $.sweetModal.ICON_ERROR, 
      buttons: [{ 
       label: 'Close', 
       classes: 'redB' 
      }] 
     }); 
    }; 
} 
... 

Answer 1

場合は、すべてのエルスにエルスこれらのステートメントのいずれかを圧迫する必要がある場合ブロック。あなたが何かを再利用していることが分かったら、それを機能にしてください。

//Store our button event as a function instead of repeating it 
function setupOrderAvailable() { 
    document.querySelector('#alert-success').onclick = function() { 
     $.sweetModal({ 
      content: '<h2>Online Ordering is Available!</h2>' + 
       'Please click the button below to begin your online order.' + 
       '<div class="sweet-modal-buttons"><a href="http://pizzospizzeria.hungerrush.com" target="_blank" class="button greenB">Start Order</a></div>', 
      // icon: $.sweetModal.ICON_SUCCESS 
     }); 
    }; 
} 

function setupOrderNotAvailable() { 
    document.querySelector('#alert-success').onclick = function() { 
     $.sweetModal({ 
      content: '<h2>Online Ordering is Not Available</h2>' + 
      'Online ordering will be available again tomorrow from 11:00am to 9:00pm', 
      // icon: $.sweetModal.ICON_ERROR, 
      buttons: [{ 
       label: 'Close', 
       classes: 'redB' 
      }] 
     }); 
    } 
}; 

//Store a flag to let us know if ordering is available or not 
var orderingIsAvailable = false; 

//Monday 
if (curr_day == '1' && get24Hr(curr_time) > get24Hr(monStartTime) && get24Hr(curr_time) < get24Hr(monEndTime)) { 
    orderingIsAvailable = true; 

//Tuesday 
} else if (curr_day == '2' && get24Hr(curr_time) > get24Hr(teuStartTime) && get24Hr(curr_time) < get24Hr(teuEndTime)) { 
    orderingIsAvailable = true; 

//Wednesday 
} else if ... 


//Call a function to setup our button depending on ordering availability 
if (orderingIsAvailable) { 
    setupOrderAvailable(); 
} else { 
    setupOrderNotAvailable(); 
} 

ここでは完全には行きませんでした。注文が可能かどうかを判断するあなたの方法ははるかに良いかもしれませんが、これは少なくとも適切な方向へのプッシュであり、あなたが探しているアラートを追加できるようにすべきです。将来的には

Answer 2

var days = { 
    // sunday 
    '1': { startTime: '4:00 PM', endTime: '4:00 PM' }, 
    // monday 
    '2': { /* ... */ }, 
    // ... 
}; 

var curr_day = new Date().getDay(); 
var curr_time = getval(); 

var day = days[curr_day]; // get the current day object from the days object 

if(day) {     // if day is supported 
    // check if day.startTime < curr_time < day.endTime 
    if(get24Hr(curr_time) > get24Hr(day.startTime) && get24Hr(curr_time) < get24Hr(day.endTime)) { 
     document.querySelector('#alert-success').onclick = function() { 
      // online ordering available blah blah 
     }; 
    } 
    else { // THE ELSE YOU WANT TO SQUEEZE IN 
     document.querySelector('#alert-success').onclick = function() { 
      // comeback tomorrow blah blah 
     }; 
    } 
} 
else { 
    // this day is not supported blah blah 
}