需要帮助下面的代码片段。当用户从
每个都按照其意图执行,除了JSON数据未在页面加载时加载。
如何使该
select
中选择一个选项时,API URL 会更新为用户想要的适当天数。但是,我已经设置了一个默认值,即在 select
option
中使用 selected
,并通过 jQuery 使用 $('#DateSelector').val('30')
。每个都按照其意图执行,除了JSON数据未在页面加载时加载。
如何使该
value
在页面加载时传递,以便默认的API URL提供正确的数据。
$('#DateSelector').val('30')
function datePeriod() {
let datePeriod = $("#DateSelector").val();
$("#DateShow").html(datePeriod);
$.getJSON(`https://discovrbookings.innocraft.cloud/?module=API&method=API.get&format=json&idSite=2&period=day&date=last${datePeriod}&token_auth=68aa5bd12137f13255dcb98794b65dff`, (data) => {
//console.log(data);
let visitors = 0;
let uniq_visitors = 0;
let pageviews = 0;
let uniq_pageviews = 0;
let actions = 0;
let outlinks = 0;
let bounces = 0;
let avgtime = 0;
for (i in data) {
if (data[i].nb_visits) {
visitors += data[i].nb_visits;
}
if (data[i].nb_uniq_visitors) {
uniq_visitors += data[i].nb_uniq_visitors;
}
if (data[i].nb_pageviews) {
pageviews += data[i].nb_pageviews;
}
if (data[i].nb_uniq_pageviews) {
uniq_pageviews += data[i].nb_uniq_pageviews;
}
if (data[i].nb_actions) {
actions += data[i].nb_actions;
}
if (data[i].nb_outlinks) {
outlinks += data[i].nb_outlinks;
}
if (data[i].bounce_count) {
bounces += data[i].bounce_count;
}
if (data[i].avg_time_on_site) {
avgtime += data[i].avg_time_on_site;
}
}
$("#visitors").html(visitors);
$("#uniq_visitors").html(uniq_visitors);
$("#pageviews").html(pageviews);
$("#uniq_pageviews").html(uniq_pageviews);
$("#actions").html(actions);
$("#outlinks").html(outlinks);
$("#bounces").html(bounces);
$("#avgtime").html(avgtime / datePeriod);
});
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="DateSelector" id="DateSelector" onchange="datePeriod();">
<option value="7">Last 7 Days</option>
<option value="14">Last 14 Days</option>
<option selected value="30">Last 30 Days</option>
<option value="90">Last 90 Days</option>
<option value="365">Last 365 Days</option>
</select>
<span id="visitors"></span>
<span id="uniq_visitors"></span>
<span id="pageviews"></span>
<span id="uniq_pageviews"></span>
<span id="actions"></span>
<span id="outlinks"></span>
<span id="bounces"></span>
<span id="avgtime"></span>
我已经浏览了许多与默认选择值相关的问题,但没有一个适合我想要实现的目标。
更新
在应用下面的答案,使用$('#DateSelector').val('30').trigger("change")
后,这是一个屏幕录制的结果。
使用其他答案
$('#DateSelector').val('30')
datePeriod();
0
。 - Darrenid="visitors"
和id="uniq_visitors"
返回的数据为零。 - Darren