Question

我想知道是否可以从另一个函数调用一个switch case。在我的页面上，用户可以选择元素$("#timeInterval")的预定义时间间隔，其中一个选项是从datepicker中选择日期，默认情况下不可见。基于这些日期，我正在创建图表。由于我在select元素上也有几个图表，我需要确保它们获得正确的日期，无论是表单选择选项还是日期选择器。我现在的问题是我需要检查日期选择器是否可见我可以从中获取日期，如果没有，我应该获得所选选项并执行具有日期的函数。

这是我的代码：

$("#timeInterval").change(function() {

    var date = moment().format("YYYY-MM-DD");
    var yesterday = moment().subtract(1, 'day').format('YYYY-MM-DD');
    var tomorrow = moment().add(1, 'day').format('YYYY-MM-DD');
    var sevenDaysAgo = moment().subtract(7, 'day').format('YYYY-MM-DD');
    var thirtyDaysAgo = moment().subtract(29, 'day').format('YYYY-MM-DD');
    var lastWeekStart = moment(date).weekday(-6).format('YYYY-MM-DD');
    var lastWeekEnd = moment(date).weekday(1).format('YYYY-MM-DD');
    var thisWeekStart = moment(date).weekday(1).format('YYYY-MM-DD');
    var startOfMonth = moment().startOf('month').format('YYYY-MM-DD');
    var startOfLastMonth = moment().subtract(1, 'month').startOf('month').format('YYYY-MM-DD');
    var endOfLastMonth = moment().subtract(1, 'month').endOf('month').format('YYYY-MM-DD');

    switch($("#timeInterval").val()) {
      case "allTime":
        $(".datePickers").hide();
        timelines(0, 0);
        barCharts(0, 0);
        $( "#list" ).empty();
        mostArticles(0, 0);
        break;
      case "today":
        $(".datePickers").hide();
        timelines(date, tomorrow);
        barCharts(date, tomorrow);
        $( "#list" ).empty();
        mostArticles(date, tomorrow);
        break;
      case "yesterday":
        $(".datePickers").hide();
        timelines(yesterday, date);
        barCharts(yesterday, date);
        $( "#list" ).empty();
        mostArticles(yesterday, date);
        break;
      case "lastSevenDays":
        $(".datePickers").hide();
        timelines(sevenDaysAgo, date);
        barCharts(sevenDaysAgo, date);
        $( "#list" ).empty();
        mostArticles(sevenDaysAgo, date);
        break;
      case "lastThirtyDays":
        $(".datePickers").hide();
        timelines(thirtyDaysAgo, tomorrow);
        barCharts(thirtyDaysAgo, tomorrow);
        $( "#list" ).empty();
        mostArticles(thirtyDaysAgo, tomorrow);
        break;
      case "thisWeek":
        $(".datePickers").hide();
        timelines(thisWeekStart, tomorrow);
        barCharts(thisWeekStart, tomorrow);
        $( "#list" ).empty();
        mostArticles(thisWeekStart, tomorrow);
        break;
      case "lastWeek":
        $(".datePickers").hide();
        timelines(lastWeekStart, lastWeekEnd);
        barCharts(lastWeekStart, lastWeekEnd);
        $( "#list" ).empty();
        mostArticles(lastWeekStart, lastWeekEnd);
        break;
      case "thisMonth":
        $(".datePickers").hide();
        timelines(startOfMonth, date);
        barCharts(startOfMonth, date);
        $( "#list" ).empty();
        mostArticles(startOfMonth, date);
        break;
      case "lastMonth":
        $(".datePickers").hide();
        timelines(startOfLastMonth, endOfLastMonth);
        barCharts(startOfLastMonth, endOfLastMonth);
        $( "#list" ).empty();
        mostArticles(startOfLastMonth, endOfLastMonth);
        break;
      default:
        $(".datePickers").show();
      }
  });

$('#datePicker').fdatepicker({
        closeButton: false,
    initialDate: weekBack,
        format: 'dd.mm.yyyy',
    endDate: dayBack,
    }).on('changeDate', function (ev) {
      var dateFrom = $("#datePicker").val().split(".").reverse().join("-");
      var dateTo = $("#datePicker1").val().split(".").reverse().join("-");
        timelines(dateFrom, dateTo);
      barCharts(dateFrom, dateTo);
      $( "#list" ).empty();
      mostArticles(dateFrom, dateTo);
  });

  $('#datePicker1').fdatepicker({
        closeButton: false,
    initialDate: date,
        format: 'dd.mm.yyyy',
    endDate: date,
    }).on('changeDate', function (ev) {
    var dateFrom = $("#datePicker").val().split(".").reverse().join("-");
    var dateTo = $("#datePicker1").val().split(".").reverse().join("-");
    timelines(dateFrom, dateTo);
    barCharts(dateFrom, dateTo);
    $( "#list" ).empty();
    mostArticles(dateFrom, dateTo);
  });

  //timeline charts
  $("#timelines").on("change", function() {
    if ($("#datePicker").is(":visible")){
      var dateFrom = $("#datePicker").val().split(".").reverse().join("-");
      var dateTo = $("#datePicker1").val().split(".").reverse().join("-");
    }
    else{
      console.log($( "#timeInterval" ).val());

    }
    timelines(dateFrom, dateTo);
  }).trigger("change");

Answer 1

是的，可能。把你的开关放在一个功能;称之为DoTimeIntervalWork之类的东西。在该功能内，您可以做您需要做的事情。请确保您传入或以其他方式访问$("#timeInterval").val()的值，以使其正常工作。重要的是，您可以在函数内部调用timelines(yesterday, date);和barCharts(yesterday, date);以及其他函数调用。如果他们不是，你可以让你的交换机返回一个函数对象，然后由DoTimeIntervalWork的调用者调用。

$("#timeInterval").change(function() {

var date = moment().format("YYYY-MM-DD");
var yesterday = moment().subtract(1, 'day').format('YYYY-MM-DD');
var tomorrow = moment().add(1, 'day').format('YYYY-MM-DD');
var sevenDaysAgo = moment().subtract(7, 'day').format('YYYY-MM-DD');
var thirtyDaysAgo = moment().subtract(29, 'day').format('YYYY-MM-DD');
var lastWeekStart = moment(date).weekday(-6).format('YYYY-MM-DD');
var lastWeekEnd = moment(date).weekday(1).format('YYYY-MM-DD');
var thisWeekStart = moment(date).weekday(1).format('YYYY-MM-DD');
var startOfMonth = moment().startOf('month').format('YYYY-MM-DD');
var startOfLastMonth = moment().subtract(1, 'month').startOf('month').format('YYYY-MM-DD');
var endOfLastMonth = moment().subtract(1, 'month').endOf('month').format('YYYY-MM-DD');

DoTimeIntervalWork($("#timeInterval").val())
  });

$('#datePicker').fdatepicker({
    closeButton: false,
initialDate: weekBack,
    format: 'dd.mm.yyyy',
endDate: dayBack,
}).on('changeDate', function (ev) {
  var dateFrom = $("#datePicker").val().split(".").reverse().join("-");
  var dateTo = $("#datePicker1").val().split(".").reverse().join("-");
    timelines(dateFrom, dateTo);
  barCharts(dateFrom, dateTo);
  $( "#list" ).empty();
  mostArticles(dateFrom, dateTo);
});

  $('#datePicker1').fdatepicker({
    closeButton: false,
initialDate: date,
    format: 'dd.mm.yyyy',
endDate: date,
}).on('changeDate', function (ev) {
var dateFrom = $("#datePicker").val().split(".").reverse().join("-");
var dateTo = $("#datePicker1").val().split(".").reverse().join("-");
timelines(dateFrom, dateTo);
barCharts(dateFrom, dateTo);
$( "#list" ).empty();
mostArticles(dateFrom, dateTo);
  });

//timeline charts
$("#timelines").on("change", function() {
 if ($("#datePicker").is(":visible")){
   var dateFrom = $("#datePicker").val().split(".").reverse().join("-");
   var dateTo = $("#datePicker1").val().split(".").reverse().join("-");
 }
 else{
     console.log($( "#timeInterval" ).val());

   }
   timelines(dateFrom, dateTo);
  }).trigger("change");

function DoTimeIntervalWork(timeInterval){
 switch(timeInterval) {
  case "allTime":
    $(".datePickers").hide();
    timelines(0, 0);
    barCharts(0, 0);
    $( "#list" ).empty();
    mostArticles(0, 0);
    break;
  case "today":
    $(".datePickers").hide();
    timelines(date, tomorrow);
    barCharts(date, tomorrow);
    $( "#list" ).empty();
    mostArticles(date, tomorrow);
    break;
  case "yesterday":
    $(".datePickers").hide();
    timelines(yesterday, date);
    barCharts(yesterday, date);
    $( "#list" ).empty();
    mostArticles(yesterday, date);
    break;
  case "lastSevenDays":
    $(".datePickers").hide();
    timelines(sevenDaysAgo, date);
    barCharts(sevenDaysAgo, date);
    $( "#list" ).empty();
    mostArticles(sevenDaysAgo, date);
    break;
  case "lastThirtyDays":
    $(".datePickers").hide();
    timelines(thirtyDaysAgo, tomorrow);
    barCharts(thirtyDaysAgo, tomorrow);
    $( "#list" ).empty();
    mostArticles(thirtyDaysAgo, tomorrow);
    break;
  case "thisWeek":
    $(".datePickers").hide();
    timelines(thisWeekStart, tomorrow);
    barCharts(thisWeekStart, tomorrow);
    $( "#list" ).empty();
    mostArticles(thisWeekStart, tomorrow);
    break;
  case "lastWeek":
    $(".datePickers").hide();
    timelines(lastWeekStart, lastWeekEnd);
    barCharts(lastWeekStart, lastWeekEnd);
    $( "#list" ).empty();
    mostArticles(lastWeekStart, lastWeekEnd);
    break;
  case "thisMonth":
    $(".datePickers").hide();
    timelines(startOfMonth, date);
    barCharts(startOfMonth, date);
    $( "#list" ).empty();
    mostArticles(startOfMonth, date);
    break;
  case "lastMonth":
    $(".datePickers").hide();
    timelines(startOfLastMonth, endOfLastMonth);
    barCharts(startOfLastMonth, endOfLastMonth);
    $( "#list" ).empty();
    mostArticles(startOfLastMonth, endOfLastMonth);
    break;
  default:
    $(".datePickers").show();
  }
}

Javascript / jQuery - 如何调用switch case从另一个函数执行

1 个答案: