互いに依存する一連の選択ボックス (A で何かを選択すると、B に値が設定されます) が与えられた場合、可能な値の組み合わせでオブジェクトを構築しようとしています。
# out = { FieldNameA: [ { key: 'A', value: '', dep: { FieldNameB: [ { key: 'B', value: '', dep: [] } ] } } ] }
これは私が使用しているコードです。
function getFieldValues(selectors) {
if (selectors.length == 0) {
return [];
}
var fieldInfo = selectors.shift();
var field = document.querySelector(fieldInfo['selector']);
for (var i=0; i<field.options.length; i++) {
var evt = document.createEvent("HTMLEvents");
evt.initEvent("change", false, true);
field.selectedIndex = i;
field.dispatchEvent(evt);
var option = field.options[i];
var fieldName = fieldInfo['name'];
if (!result[fieldName]) {
result[fieldName] = [];
}
var fieldData = { key: option.value, value: option.innerHTML };
alert('starting child retrieval of data');
var dependencies = getFieldValues(selectors.slice(0));
if (dependencies) {
fieldData['dependencies'] = dependencies;
}
result[fieldName].push(fieldData);
}
return result;
}
out = getFieldValues(selectors);
console.log(JSON.stringify(out));
ディスパッチ イベント コードの後に遅延を追加するために非同期にする必要があるため、2 番目の選択の値が取り込まれます。ただし、このコードを変換する試みは失敗しました。