注入HTML-Java失败,并在随后的不可见HTML检索中未定义

时间:2018-11-20 15:05:15

标签: javascript html bootstrap-modal

我有一个引导程序模态,其下拉列表编号为0-7。第一次选择值时,我的JavaScript会通过获取所需的HTML并将其注入到模态主体中来工作。检索要注入的HTML时,所有后续选择都将失败并显示“ undefined”。

我的模态主体如下(目前,我有3个不同的HTML,它们是隐藏的。当显示模态时,“ ParagraphAnswer”首先显示。这3个不同的HTML是ParagraphAnswer,TrueAndFalseAnswer和MultipleAnswer):

<div class="modal-body">
<div id="ParagraphAnswer">
    <div class="modalBody">
        <div class="form-group-sm">
            @Html.Label("Correct Answer", new { style = "font-weight:bold;" })
            @if (ViewData["TestQuestionError"] != null)
            {
                @Html.TextAreaFor(m => m.TestsQuestions.Correct_Answer, new { @class = "form-control", style = "font-size: 1em; margin-top: -5px; width: 725px;", autofocus = "autofocus" })
            }
            else
            {
                @Html.TextAreaFor(m => m.TestsQuestions.Correct_Answer, new { @class = "form-control", style = "font-size: 1em; margin-top: -5px; width: 725px;" })
            }
        </div>
    </div>
</div>
<div id="TrueAndFalseAnswer" class="invisible">
    <div class="modalBody">
        <div class="form-group-sm">
            @Html.Label("I am a Checkbox")
        </div>
    </div>
</div>
<div id="MultipleAnswer" class="invisible">
    <div class="modalBody">
        <div class="form-group-sm">
            @Html.Label("I am a MultipleAnswer")
        </div>
    </div>
</div>

每次我从下拉列表中进行其他选择时,javascript都应该换出模式主体部分。第一次可以正常运行,但是后续选择不会检索javascript要求的HTML。我相信问题不在于javascript,而是我的HTML的结构。

任何帮助将不胜感激!!!

这是我的javascript的一部分:

<script type='text/javascript'>
$(document).ready(function () {
        var $modalBody = $("#Question .modal-body");

        $("#ddlQuestionType").change(function () {

        var myQuestionType = document.getElementById('ddlQuestionType').value;

        if (myQuestionType == 0) {
            var modalBodyContent = $("#MultipleAnswer .modalBody").html();
            alert(modalBodyContent);
            $modalBody.html(modalBodyContent);
        };

        if (myQuestionType == 1) {
            var modalBodyContent = $("#ParagraphAnswer .modalBody").html();
            alert(modalBodyContent);
            $modalBody.html(modalBodyContent);
        };

        if (myQuestionType == 5) {
            var modalBodyContent = $("#TrueAndFalseAnswer .modalBody").html();
            alert(modalBodyContent);
            $modalBody.html(modalBodyContent);
        };
    });
});

0 个答案:

没有答案