Question

您好我有这四个文本框，并且有一个+添加体验按钮，它将添加另一组文本框。我已经解决了传递所有数据的问题。我的问题是如何才能分别获取数据。这是我的截图文本框

这是我的jquery脚本

$("#test").click(function() {

    var resumeEmployer = $("input[id='resume-employer']").map(function() {
        return $(this).val();
    }).get();

    var resumeJobTitle = $("input[id='resume-job-title']").map(function() {
        return $(this).val();
    }).get();

    var startDateEndDate = $("input[id='resume-experience-dates']").map(function() {
        return $(this).val();
    }).get();

    var responsibilities = $("input[id='resume-responsibilities']").map(function() {
        return $(this).val();
    }).get();

    //alert(resumeEmployer);
    //alert(resumeJobTitle);
    //alert(startDateEndDate);
    //alert(responsibilities);

    $.each(resumeEmployer, function(index, value) {
        var resumeEmp = "";
        resumeEmp += "<input type='text' value='" + value + "'>";
        alert(resumeEmp);
    });

    //$.each(resumeJobTitle, function( index, value ){
    //    alert( index + ": " + value );
    //});


});

这是我的html外观

<div class="row">
                        <div class="col-sm-12">
                            <p>&nbsp;</p>
                            <h2>Experience</h2>
                        </div>
                    </div>
                    <div class="row experience">
                        <div class="col-sm-6">
                            <div class="form-group" id="resume-employer-group">
                                <label for="resume-employer">Employer</label>
                                <input type="text" class="form-control" name="resumeEmployer" id="resume-employer" value="<?php echo set_value('resumeEmployer'); ?>" id="resume-employer" placeholder="Company name">
                            </div>
                        </div>
                        <div class="col-sm-6">
                            <div class="form-group" id="resume-experience-dates-group">
                                <label for="resume-experience-dates">Start/End Date</label>
                                <input type="text" class="form-control" name="resumeExperienceDates" name="<?php echo set_value('resumeExperienceDates'); ?>" id="resume-experience-dates" placeholder="e.g. April 2010 - June 2013">
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-sm-6">
                            <div class="form-group" id="resume-job-title-group">
                                <label for="resume-job-title">Job Title</label>
                                <input type="text" class="form-control" name="resumeJobTitle" id="resume-job-title" value="<?php echo set_value('resumeJobTitle'); ?>" placeholder="e.g. Web Designer">
                            </div>
                        </div>
                        <div class="col-sm-6">
                            <div class="form-group" id="resume-responsibilities-group">
                                <label for="resume-responsibilities">Responsibilities (Optional)</label>
                                <input type="text" class="form-control" name="resumeResponsibilities" id="resume-responsibilities" value="<?php echo set_value('resumeResponsibilities');?>" placeholder="e.g. Developing new websites">
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-sm-12">
                            <hr class="dashed">
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-sm-12">
                            <p><a id="add-experience">+ Add Experience</a></p>
                            <hr>
                        </div>
                    </div>

我的jquery脚本也适用于id="add-experience"

var NewExperience='<div class="row experience"><div class="col-sm-6"><div class="form-group" id="resume-employer-group"><label for="resume-employer">Employer</label><input type="text" class="form-control" id="resume-employer" placeholder="Company name"></div></div><div class="col-sm-6"><div class="form-group" id="resume-experience-dates-group"><label for="resume-experience-dates">Start/End Date</label><input type="text" class="form-control" id="resume-experience-dates" placeholder="e.g. April 2010 - June 2013"></div></div></div><div class="row"><div class="col-sm-6"><div class="form-group" id="resume-job-title-group"><label for="resume-job-title">Job Title</label><input type="text" class="form-control" id="resume-job-title" placeholder="e.g. Web Designer"></div></div><div class="col-sm-6"><div class="form-group" id="resume-responsibilities-group"><label for="resume-responsibilities">Responsibilities (Optional)</label><input type="text" class="form-control" id="resume-responsibilities" placeholder="e.g. Developing new websites"></div></div></div><div class="row"><div class="col-sm-12"><hr class="dashed"></div></div>'

        $("#add-experience").click(function(){
            $(this).parent().parent().parent().before(NewExperience);
        });

我希望第一组文本框数据也可以获得第二组数据，依此类推。

非常感谢任何帮助。 TIA

Answer 1

您可以迭代每个experience对象，为每个对象创建一个对象

var array = $('.experience').map(function() {
  var obj = {};
  $(this).find('input:text').each(function() {
    obj[this.id] = this.value;
  });
  return obj;
}).get();

我将如何在jquery中单独传递数据

1 个答案: