我的页面中有一个日期输入,我使用Daterangepicker框架来填充它。
以下是我如何开始页面的代码!
$(function(){
startSelectors();
var variaveis = returnInputVars();
var rede = variaveis[0];
var codLoja = variaveis[1];
var period = variaveis[2];
console.log('1.'+rede+' 2.'+codLoja+' 3.'+period);
});
function returnInputVars(){
var rede = $("#dropdown-parceria").val();
var codLoja = $("#dropdown-loja").val();
var periodo = $("#datepicker-range").val();
return [rede, codLoja, periodo];
};
function
startSelectors()设置为启动我的datepicker和其他字段,这是完美的。在它之后,我创建一个名为" variaveis"填写
使用每个字段的值,因为我稍后会使用(此功能也可以在我页面的其他脚本中完美运行)。
运行页面,我的控制台返回:
有趣的是,如果我在控制台输入此值,则会显示该值,只是在启动脚本时不起作用!
有人经历过这样的事吗?
*** UPDATE
将此脚本添加到我的启动功能:
console.log($("#datepicker-range"));
显示该值,但第二个console.log不显示:
编辑1. FIDDLE(由@halleron推荐)
答案 0 :(得分:0)
为了确保以正确的顺序加载内容,应用页面嗅探器代码片段将非常有用,该代码段将连续扫描页面直到满足条件,或者直到达到预设的计数器限制(以防止对浏览器内存造成压力) )。以下是我通常使用的适合您的方案的示例。
我认为因为你正在处理asynchronous loading,所以你不能拥有一个全局变量来保存全局范围内的值而没有间隔来检测何时可以使用它。否则,它将尝试在尚未准备好时读取变量。
您可以随意调用任何功能。但是我会将所有变量保存在page_sniffer_2017()中,因为这是一个受控环境,您知道所有内容都已成功加载,并且您知道变量已准备就绪,无错误地访问。
这样,无论连接速度如何,您的功能只会在准备就绪时触发,您的代码将以正确的顺序依次流动。
在ajax成功选项中,始终将一个类添加到您可以搜索的文档的body
,以确定它是否已完成加载。
$(document).ready(function() {
page_sniffer_2017();
});
function page_sniffer_2017() {
var counter = 0;
var imgScanner = setInterval(function() {
if ($("#datepicker-range").length > 0 && $("#datepicker-range").val().length && jQuery('body').hasClass('date-picker-successfully-generated')) {
var periodoDatepicker = $("#datepicker-range").val(); // ok
console.log(periodoDatepicker); // ok
var variaveis = returnInputVars(replaceDate(periodoDatepicker)); // ok
console.log(variaveis[0], variaveis[1], variaveis[2]);
//startNewSelectors(variaveis);
// start ajax call
generateData(variaveis[0], variaveis[1], variaveis[2]);
clearInterval(imgScanner);
} else {
//var doNothing = "";
counter++;
if (counter === 100) {
console.log(counter);
clearInterval(imgScanner);
}
}
}, 50);
}