使用jquery获取div中各种输入类型的值

Question

我有两个 div，我根据用户是要添加单选选项还是多个选项来切换它们。 因此，一次只能看到 1 个 div。

<div class="form-group row" id="divOptions">
        @Html.Label("Choices", htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10" id="divSingleChoice">
            <div class="elementRadio" id="div_0">
                <label class="radio-inline">
                    <input type="radio" name="UserChoice" value="0" checked />
                    <input type="text" id="txt_0" name="UserChoices[0].ChoiceText" value="@Request.Form["UserChoices[0].ChoiceText"]" />
                </label>
            </div>
            <div class="elementRadio" id="div_1">
                <label class="radio-inline">
                    <input type="radio" name="UserChoice" value="1" />
                    <input type="text" id="txt_1" name="UserChoices[1].ChoiceText" value="@Request.Form["UserChoices[1].ChoiceText"]" />
                </label>
            </div>
            <input type="hidden" id="RadioChoiceCount" name="RadioChoiceCount" value="2" />
        </div>
        <div class="col-10" id="divMultiChoice" style="display:none">
            <div class="elementMultiple" id="div_0">
                <label class="radio-inline">
                    <input type="checkbox" name="IsChecked_0" checked />
                    <input type="text" id="txt_0" name="MChoiceText_0" value="@Request.Form["MChoiceText_0"]" />
                </label>
            </div>
            <div class="elementMultiple" id="div_1">
                <label class="radio-inline">
                    <input type="checkbox" name="IsChecked_1" />
                    <input type="text" id="txt_1" name="MChoiceText_1" value="@Request.Form["MChoiceText_1"]" />
                </label>
            </div>
            <input type="hidden" id="MultiChoiceCount" name="MultiChoiceCount" value="2" />
        </div>
        <div class="offset-2 col-10 form-group">
            <input type="submit" value="Add Choice" id="addChoice" class="btn btn-primary" />
        </div>
    </div>

我需要帮助来查找选项以及单选/复选框选择。 我正在使用以下 jquery，但无法正常工作：

$("#btnSave").click(function (e) {
var data = new FormData();
var selectedVal = $("#QuestionTypeID option:selected").text().toLowerCase();
if (selectedVal == 'radio') {
            data.append("UserChoice", $("divSingleChoice input[type='radio']:checked").val());

            $(".elementRadio").each(function (index, element) {
                var text2 = $(this).closest("input[type=text]").text();
                alert(text2);
                data.append("UserChoices[" + index + "].ChoiceText", $(this).closest("input[type=text]").text());
            });
        }
        else {
            $(".elementMultiple").each(function (index, element) {
                data.append("IsChecked_" + index, $(this).closest("input[type=checkbox]").prop("checked"));
                data.append("MChoiceText_" + index, $(this).closest("input[type=text]").text());
            });
        }
}

感谢任何帮助。谢谢。

Answer 1

这就是我最终做的-

$("#btnSave").click(function (e) {
var data = new FormData();
var selectedVal = $("#QuestionTypeID option:selected").text().toLowerCase();
        if (selectedVal == 'radio') {
            data.append("UserChoice", $("#divSingleChoice input[type='radio']:checked").val());
            $('input[type=text]', $('#divSingleChoice')).each(function (index) {

                if ($(this).prop('type') == 'text') {
                    // "this" is the current element in the loop
                    data.append("UserChoices[" + index + "].ChoiceText", this.value); 
                }
            });
        }
        else {
            var i = 0; //increase after every checkbox and text pair
            $('input', $('#divMultiChoice')).each(function () {
                // "this" is the current element in the loop
                if ($(this).prop('type') == 'checkbox') {
                    data.append("UserChoices[" + i + "].IsChecked", $(this).prop('checked'));
                }

                if ($(this).prop('type') == 'text') {
                    data.append("UserChoices[" + i + "].ChoiceText", this.value);
                    i++;
                }
            });
        }
}