Question

我有JS脚本文件。

在这个文件中，我有一些代码用日历

中的值填充输入

这是代码。

$(document).ready(function () {

columnSettings = $('#visibleColumns').val();

SetColumnCheckboxes();

$('#tableDetails').DataTable({
    'columnDefs': columnDefs,
    'sDom': '<"table-options"<"top length"l><"top paging"p><"top filtering"f>>rt<"bottom"i>',
    'sScrollY': '1px',
    'scrollX': true,
    'autoWidth': true,
    'lengthMenu': [[-1, 10, 25, 50, 100], [dictionary.find('all'), 10, 25, 50, 100]],
    'language': dataTablesLanguage
});

//cultureTwoLetterName is a global variable from the view that contains the two letter iso language name
$.datepicker.setDefaults($.datepicker.regional[cultureTwoLetterName]);

$('#calendar').weekMonthDatepicker({
    changeMonth: true,
    dateFormat: 'yy-mm-dd',
    showWeek: true,
    firstDay: 1,
    weekHeader: '<span class="glyphicon glyphicon-arrow-down"></span>',
    minDate: -loggingRetention,
    maxDate: '+0D',
    weekSelection: true,
    weekSelected: SelectionCallback,
    monthSelection: true,
    monthSelected: SelectionCallback
});

$('#startDate').datepicker({
    changeMonth: true,
    dateFormat: 'yy-mm-dd',
    firstDay: 1,
    minDate: -loggingRetention,
    maxDate: '+0D'
});


$('#endDate').datepicker({
    changeMonth: true,
    dateFormat: 'yy-mm-dd',
    firstDay: 1,
    minDate: -loggingRetention,
    maxDate: '+0D'
});

$('#selectGroups').on('change', function () {
    PopulateSelectVehicles();
});

$('#selectVehicles').on('change', function () {
    var imei = $(this).val();
    var device = getDevice(imei);
    configureReportpageForDevice(device);

    var start = $('#calendar').weekMonthDatepicker('getStartDate');
    var stop = $('#calendar').weekMonthDatepicker('getEndDate');
    var ui;

    if (start != null && stop != null) {
        var ui = { 'startDate': start, 'endDate': stop };
    }

    PopulateTableDetails(null, ui);
});

$('#calendar').on('change', function () {
    $('#startDate').val(moment($(this).val()).format('DD/MM/YYYY'));
    $('#endDate').val(moment($(this).val()).format('DD/MM/YYYY'));
    startdate = $('#startDate').val();
    end = $('#endDate').val();
    alert(end);
    var start = $('#calendar').weekMonthDatepicker('getStartDate');
    var stop = $('#calendar').weekMonthDatepicker('getEndDate');
    var ui;
    if (start != null && stop != null) {
        ui = { 'startDate': start, 'endDate': stop };

    }

    PopulateTableDetails(null, ui);
});

$('#startDate').on('change', function () {
    $(this).val(moment($(this).val()).format('DD/MM/YYYY'));

    if ($('#endDate').val() == '' || moment($('#endDate').val(), 'DD/MM/YYYY') < moment($(this).val(), 'DD/MM/YYYY')) { //endDate niet ingevuld of < startDate --> endDate = startDate
        $('#endDate').val($(this).val());
    }

    var start = moment($(this).val(), 'DD/MM/YYYY');
    var stop = moment($('#endDate').val(), 'DD/MM/YYYY');

    var ui = { 'startDate': start, 'endDate': stop };

    PopulateTableDetails(null, ui);
});

$('#endDate').on('change', function () {
    $(this).val(moment($(this).val()).format('DD/MM/YYYY'));

    if ($('#startDate').val() == '' || moment($('#startDate').val(), 'DD/MM/YYYY') > moment($(this).val(), 'DD/MM/YYYY')) { //startDate niet ingevuld of > endDate --> startDate = endDate
        $('#startDate').val($(this).val());
    }

    var start = moment($('#startDate').val(), 'DD/MM/YYYY');
    var stop = moment($(this).val(), 'DD/MM/YYYY');
    var ui = { 'startDate': start, 'endDate': stop };

    PopulateTableDetails(null, ui);
});

}）;

我需要从startDate和endDate

获取值

我可以在startdate = $('#startDate').val();函数中编写$('#calendar').on('change', function () {。

但是我有document.ready块之外的功能，它与地图相关联，无法在document.ready块中使用。

以下是此功能的代码

function getDriving() {
var startdatevalue = startdate;
alert(startdatevalue);
var url = $('#map').data('request-url2');
$.getJSON(url,
    function (data) {
        var marker = [];

        $.each(data,
            function (i, item) {
                marker.push({
                    'location': new google.maps.LatLng(item.Latitude, item.Longitude),
                    'map': map,
                    'weight': item.Speed,
                    'radius': 10
                });
            });
        var pointArray = new google.maps.MVCArray(marker);

        heatmap = new google.maps.visualization.HeatmapLayer({
            data: pointArray
        });
        heatmap.setMap(map);
    });

};

当我在其中写var startdatevalue = startdate; alert(startdatevalue);时，它为空。

我如何才能正确获得此功能的价值？

以下是js Code

的完整代码

我尝试在initMap中编写document.ready和其他相关函数，但我收到initMap not a function错误。因为查看<script async src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCea6m‌L2cqwVid2ESIjuJ0C31R‌bNVQNPY0&libraries=v‌isualization&callbac‌k=initMap"> </script>

中的这一行

感谢帮助

Answer 1

这是一个常见问题。这都是关于范围的。您在.ready事件中强制转换的任何var仅在该范围（函数）中可用。

因此，解决方法是将var转换为该函数。（全球范围）

如果您有其他需要阅读这些变量的模块/功能，最好的办法是制作自己的应用程序对象并设置变量，然后您可以在应用程序代码的其他位置读取这些变量。

  var app  = {};

    ..

    $(document).ready(function () {

    app.startdate = //some value

    ..

    });

现在，您可以在应用中的任何其他位置访问该全局对象

console.log(app.startdate)

我使用了一个全局对象，因为您可能需要具有可由外部模块访问的开始日期，结束日期和其他变量

你可以做到

var startdate

在就绪功能之外，这也将起作用。

此设计方法的问题在于，当第二个函数请求时，可能无法设置var。

通过将var直接传递给另一个函数来解决此问题。或者使用事件驱动系统，其中函数2订阅函数1上的事件，该事件在设置或更改时传递var。

从不在$（document）.ready（JS）的函数中获取输入值

1 个答案: