Question

这是我的HTML代码：

<div data-repeater-item class="mt-repeater-item prescribeData">
        <div class="mt-repeater-cell">
            <div class="row">
                <div class="col-md-6">
                    <div class="form-group">
                        <div class="input-group">
                            <span class="input-group-addon input-circle-left capsule-lightblue">
                                <i class="fa fa-stethoscope blue-icon-font"></i>
                            </span>
                            <input type="text" id="prescribe_test" class="form-control typeahead-prescribetest input-circle-right" placeholder="Prescribe Test">
                        </div>
                        <span class="help-block">Name of Investigation</span>
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="form-group">
                        <div class="input-group">
                            <span class="input-group-addon input-circle-left capsule-lightblue">
                                <i class="fa fa-stethoscope blue-icon-font"></i>
                            </span>
                            <input type="text" id="diagnosis_input" class="form-control typeahead-diagnosis input-circle-right" placeholder="Duration of Investigation (Optional)">
                        </div>
                        <span class="help-block">e.g. Once, Weekly, Monthly</span>
                    </div>
                </div>
               <div class="col-md-1 pull-right col-sm-6 col-xs-6">
                   <a href="javascript:;" style="margin-right:20px;" class="btn-circle prescribeAddData btn green-meadow mt-repeater-btn-inline"> <i class="fa fa-plus"></i>
                   </a>
            </div>
            </div>
        </div>
    </div>

我想使用JQuery代码获取变量中的所有输入元素数据：

我目前正在使用此代码：

$(document.body).on('click', 'a.prescribeAddData', function ()
        {
            console.log($(this).closest($(".prescribeData :input")));
        });

但是此代码在输入元素后不会显示元素所持有的数据。

如何修复此逻辑？

Answer 1

您可以使用find方法查找特定元素的子元素然后迭代它们，然后将值存储在数组中。

var inputFields = $('.prescribeData').find('input');
var values = [];
inputFields.each(function(){
    values.push($(this).val())
})
console.log(values)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div data-repeater-item class="mt-repeater-item prescribeData">
        <div class="mt-repeater-cell">
            <div class="row">
                <div class="col-md-6">
                    <div class="form-group">
                        <div class="input-group">
                            <span class="input-group-addon input-circle-left capsule-lightblue">
                                <i class="fa fa-stethoscope blue-icon-font"></i>
                            </span>
                            <input type="text" id="prescribe_test" class="form-control typeahead-prescribetest input-circle-right" placeholder="Prescribe Test">
                        </div>
                        <span class="help-block">Name of Investigation</span>
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="form-group">
                        <div class="input-group">
                            <span class="input-group-addon input-circle-left capsule-lightblue">
                                <i class="fa fa-stethoscope blue-icon-font"></i>
                            </span>
                            <input type="text" id="diagnosis_input" class="form-control typeahead-diagnosis input-circle-right" placeholder="Duration of Investigation (Optional)">
                        </div>
                        <span class="help-block">e.g. Once, Weekly, Monthly</span>
                    </div>
                </div>
            </div>
        </div>
    </div>

如何获取当前div的所有输入元素数据？

1 个答案: