我创建了一个具有四个下拉列表的模式下拉表单,其中第四个下拉列表包含指向文档的链接,该链接将在用户单击“提交”按钮后显示。所有四个下拉菜单都可以正常工作,但是当单击“提交”按钮时,文档不会显示。该表格只是继续显示。任何帮助表示赞赏。
var selectedOptions = {};
$('#link1').on('change', function () {
var a = $(this).val();
selectedOptions['1'] = a;
selectedOptions['2'] = a;
selectedOptions['3'] = a;
if (a !== '') {
for (var i = 0; i < dataSecondSelect[a].length; i++) {
$('#link2').append($("<option></option>")
.attr("value", dataSecondSelect[a][i])
.text(dataSecondSelect[a][i]));
}
}
});
$('#link2').on('change', function () {
var a = $(this).val();
selectedOptions['1'] = a;
selectedOptions['2'] = a;
selectedOptions['3'] = a;
if (a !== '') {
for (var i = 0; i < dataThirdSelect[a].length; i++) {
$('#link3').append($("<option></option>")
.attr("value", dataThirdSelect[a][i])
.text(dataThirdSelect[a][i]));
}
}
});
$('#link3').on('change', function () {
var a = $(this).val();
selectedOptions['1'] = a;
selectedOptions['2'] = a;
selectedOptions['3'] = a;
if (a !== '') {
for (var i = 0; i < dataFourthSelect[a].length; i++) {
$('#link4').append($("<option></option>")
.attr("value", dataFourthSelect[a][i].link)
.text(dataFourthSelect[a][i].form));
}
}
});
$('#clickButton').on('click', function () {
var error = false;
$(".error").remove();
$(".validation-error").removeClass('validation-error');
$('#myModal select').each(function () {
// validate first
if ($(this).val() === "") {
var _message = "Please select an option";
$(this).addClass('validation-error');
$(this).after($('<div class="error"></div>').text(_message));
error=true;
}
});
if (error) { return; }
// form is now validated so get the link
var _index = $("#link4").val();
var _form = dataFourthSelect[_index][0].link;
resetForm($(this)[0]);
$('#myModal').modal('hide');
openDoc(_form);
});
function resetForm(e) {
$(".error").remove();
$(".validation-error").removeClass('validation-error');
e.form.reset();
}
</script>
答案 0 :(得分:0)
在检查您给定的代码时,我发现#link4
不存在。
因此,行var _index = $("#link4").val();
将返回undefined
,随后将使下面的代码行失败
var _form = dataFourthSelect[_index][0].link;
希望这会有所帮助。