如何克隆表单(地址输入）?不工作

How can I clone the form ( address input) ? not working

本文关键字：工作 输入 地址 何克隆 表单      更新时间：2023-09-26

如何克隆表单（地址输入）？ 不起作用如何解决此问题我想以这样的方式做，当用户删除输入然后添加它时，它应该再次成为活动输入。https://jsfiddle.net/joio/95o0wyfy/29

$('.add_input').eq(0).click(function() {
            form_a++;
            var formhtml = $('#divform_a .form').eq(0).html().toString();
            formhtml = formhtml.replace(/form_a/g, 'form_item'+form_a);
            $('#divform_a').eq(0).append('<div class="form">' + formhtml + '</div>');
                    focus_map_location = jQuery('#divform_a .form:last .map_location');
            $("#divform_a .form:last .address").removeAttr('id');
            address_form = $("#address").parent();
            $("#address").clone(true).prependTo(address_form).removeAttr('id');
            address_name = $("#divform_a .form:last .address").attr('name');
            $("#divform_a .form:last .address").remove();
            $("#address").prependTo($("#divform_a .form:last")).attr('name',address_name).val('');
        });

你的问题似乎出在这两行

address_form = $("#address").parent();
$("#address").clone(true).prependTo(address_form).removeAttr('id');

您的代码不会将 id 设置为新创建的input标记。删除带有 id 的原始元素后，预写将停止工作。此外，这似乎比应有的要复杂得多。

这就是复制（以及使名称标签正常工作）所需的全部内容

$('.add_input').click(function() {
    form_a++;
    var copiedForm = $('#divform_a .form').eq(0).clone();
    copiedForm.attr('name', 'form_item'+form_a);
    $('#divform_a').append(copiedForm);
});

小提琴

编辑：

这是您的小提琴，只需进行最少的更改。末尾的以下行恢复了对第一个输入的#address，现在复制功能

正常工作 
$("#divform_a .form:first .address").attr('id', 'address');

我仍然建议查看第一小提琴中的代码并尝试清理。或者至少，从中学习:)

第二次编辑：

在地图小提琴中，您仅初始化第一个字段的自动完成功能。你应该做这样的事情

$('.address').each(function(){
    var autocomplete = new google.maps.places.Autocomplete(this);
    autocomplete.bindTo('bounds', map); 
    autocomplete.setTypes([]);
    google.maps.event.addListener(autocomplete,'place_changed', function() {
        infowindow.close();
        markerPoint.setVisible(false);
        var place = autocomplete.getPlace();
        if (!place.geometry) {
          return;
        }
    });
  });
  });

这将对这两个字段进行自动完成。克隆会自动选取该属性。

相关文章：