我一直在创建一个工具,需要创建一系列下拉菜单来选择一个配置文件/视图ID(来自谷歌分析),填充下一个菜单,更改上一个菜单(选择正确的属性)对于正确的帐户,然后是正确属性的正确配置文件。)
为此,我做了一个小的jquery / javascript for循环系统,我觉得它实际上非常混乱,但我不确定如何改进它(虽然不是问题的一部分,但这可能是我和#39;我遇到了问题,虽然我不确定。)
此脚本适用于我测试的所有浏览器,包括我真正感到高兴的移动设备。
然而,当该工具启动时,两个人(大约一百人)回来说没有选择个人资料/视图。这非常好奇,因为我无法复制这个错误。
我曾与其中一个人接触并尝试过调试(尽管通过长时间的会议等进行缓慢的过程等),但无法找到解决办法(虽然我认为我设法隔离了问题,将在代码示例之后指出。
所以我的问题是这个。什么可能导致这个长度的未定义错误,为什么它只发生在1-2个人中的一大部分(似乎在jquery.min.js:2使用jquery版本1.11.1?)。当属性发生变化时,似乎发生了错误,这很奇怪,因为配置文件正确填写。此外,我问客户端是否可以使用不同的浏览器和帐户,但同样的错误仍然存在。
以下是创建下拉列表的代码:
function fillDropdownMenus(){
var accounts = <?php echo json_encode($accountsArray); ?>;
var propertiesSelectHtml = '<div class="col-xs-12 col-md-4 properties"><select class="col-xs-12" id="properties"><option selected="selected">PROPERTY NAMES</option></select></div>';
var profilesSelectHtml = '<div class="col-xs-12 col-md-4 profiles"><select class="col-xs-12" id="profiles"><option selected="selected">VIEW NAMES</option></select></div>';
accounts.forEach(function(account){
var accountIterator = 0;
account.account['id'].forEach(function(accountId){
$('#accounts').append('<option value="'+accountId+'">'+account.account['name'][accountIterator]+'</option>');
accountIterator++;
});
});
$('.accounts').on('change','#accounts', function(event){
var currentAccount = $('#accounts').val();
$('.properties').remove();
$('.profiles').remove();
$('.accounts').after(propertiesSelectHtml);
accounts.forEach(function(account){
$.each(account.account, function(accountkey, accountvalue){
if(accountvalue == currentAccount){
var propertyIterator = 0;
account.account['property']['id'].forEach(function(propertyId){
$('#properties').append('<option value="'+propertyId+'">'+account.account['property']['name'][propertyIterator]+'</option>');
propertyIterator++;
});
}
});
});
$('.properties').on('change','#properties', function(ev){
var currentProperty = $('#properties').val();
$('.profiles').remove();
$('.properties').after(profilesSelectHtml);
accounts.forEach(function(account){
$.each(account.account['property'], function(propertykey, propertyvalues){
if($.type(propertyvalues) == 'object' || $.type(propertyvalues) == 'array'){
for(var k in propertyvalues){
var propertyvalue = propertyvalues[k];
if(propertyvalue == currentProperty){
var profileIterator = 0;
account.account['property']['profile']['id'].forEach(function(profileId){
$('#profiles').append('<option value="'+profileId+'">'+account.account['property']['profile']['name'][profileIterator]+'</option>');
profileIterator++;
});
}
}
} else {
if(propertyvalue == currentProperty){
var profileIterator = 0;
account.account['property']['profile']['id'].forEach(function(profileId){
$('#profiles').append('<option value="'+profileId+'">'+account.account['property']['profile']['name'][profileIterator]+'</option>');
profileIterator++;
});
}
}
});
});
$('#profiles').on('change', function(e){
$('#view_id').removeAttr('value');
var currentProfile = $('#profiles').val();
$('#view_id').val(currentProfile);
});
});
});
}
fillDropdownMenus();
对象结构:
Object -> account (object) -> id (array)
-> name (array)
-> property (object) -> id (array)
-> name (array)
-> profile (object) -> id (array)
-> name (array)
感谢您就我的这个问题提出的意见,因为我已经在墙上砸了几天试图解决这个问题!
编辑:http://codepen.io/zephyr/pen/VYQPKQ此处列出了行动中的列表。
答案 0 :(得分:0)
这似乎是我的javascript非常不一致的错误(有很多不同的循环没有帮助)。在我将它们全部更改为正常.each jquery循环之后,它似乎解决了问题,并使整个菜单集工作得更好,因为还有一些逻辑错误(我没有按属性过滤配置文件,它是只需在选中该属性时为该帐户显示所有内容。