Php 在谷歌方向服务中使用多个航路点

Php 在谷歌方向服务中使用多个航路点,php,jquery,google-directions-api,googleplacesautocomplete,Php,Jquery,Google Directions Api,Googleplacesautocomplete,我的站点中有以下代码用于计算收货地址、落货地址和一个航路点之间的距离(可选) 相关HTML代码如下所示: <form class="booking-form-1 one-way-transfer-form"> <input type="text" name="pickup-address" id="pickup-address1" class="pickup-address" placeholder="' . esc_h

我的站点中有以下代码用于计算收货地址、落货地址和一个航路点之间的距离(可选)

相关HTML代码如下所示:

<form class="booking-form-1 one-way-transfer-form">

                            <input type="text" name="pickup-address" id="pickup-address1" class="pickup-address" placeholder="' . esc_html__( 'Pick Up Address', 'chauffeur' ) . '" />
                            <div class="pickup-via-input">
                                <div class="via_wrapper" id="via_wrapper">
                                    <div>   
                                        <input type="text" id="pickup-via1" class="pickup-via" placeholder="' . esc_html__( 'Pickup Via Address', 'chauffeur' ) . '" />
                                        <a href="javascript:void(0);" class="add_button" title="Add field"><img src="'. get_stylesheet_directory_uri() .'/images/add-icon.png"/></a>
                                    </div>
                                </div>
                            </div>
                            <input type="text" name="dropoff-address" id="dropoff-address1" class="dropoff-address" placeholder="' . esc_html__( 'Drop Off Address', 'chauffeur' ) . '" />
                            <input type="checkbox" id="waypoint-check" class="waypoint-check" /> <span style="color:#fff">Add Waypoint</span>

                            <div class="clear"></div>

                            <div class="route-content">
                                <div id="display-route-distance" class="left-col-distance"></div>
                                <div id="display-route-time" class="right-col-time"></div>
                            </div>
                            <div class="clear"></div>

                            <input type="hidden" name="route-distance-string" id="route-distance-string" />
                            <input type="hidden" name="route-distance" id="route-distance" />
                            <input type="hidden" name="route-time" id="route-time" />

                            <div id="atbMap"></div>

                            <input type="hidden" name="pickup-address-lat" id="pickup-address-lat" />
                            <input type="hidden" name="pickup-address-lng" id="pickup-address-lng" />
                            <input type="hidden" name="pickup-via-lat" id="pickup-via-lat" />
                            <input type="hidden" name="pickup-via-lng" id="pickup-via-lng" />
                            <input type="hidden" name="dropoff-address-lat" id="dropoff-address-lat" />
                            <input type="hidden" name="dropoff-address-lng" id="dropoff-address-lng" />

添加航路点
现在我想添加使用+,-按钮添加多个航路点输入的功能

如何设置每次添加新航路点时更改地点的侦听器,以便它也计算所有以前的航路点(如果有)

这是我为多个航路点添加的代码,并在其中添加了自动完成

$('.add_button').click(function(){
        pickupViaCount++;
        //console.log(pickupViaCount);
        var fieldHTML = '<div><input type="text" id="pickup-via'+ pickupViaCount +'" class="pickup-via" placeholder="Pickup Via Address" /><a href="javascript:void(0);" class="remove_button"><img src="' + path_vars.image_dir_path + '/remove-icon.png"/></a></div>';
        $('.via_wrapper').append(fieldHTML);

        var newEl = document.getElementById('pickup-via' + pickupViaCount);
        var placee2 = new google.maps.places.Autocomplete(newEl, options);
        newInput.push(newEl);
$('.add_按钮')。单击(函数(){
pickupViaCount++;
//控制台日志(pickupViaCount);
var fieldHTML='';
$('.via_wrapper').append(fieldHTML);
var newEl=document.getElementById('pick-via'+pickupViaCount);
var placee2=newgoogle.maps.places.Autocomplete(newEl,options);
newInput.push(newEl);
$('.add_button').click(function(){
        pickupViaCount++;
        //console.log(pickupViaCount);
        var fieldHTML = '<div><input type="text" id="pickup-via'+ pickupViaCount +'" class="pickup-via" placeholder="Pickup Via Address" /><a href="javascript:void(0);" class="remove_button"><img src="' + path_vars.image_dir_path + '/remove-icon.png"/></a></div>';
        $('.via_wrapper').append(fieldHTML);

        var newEl = document.getElementById('pickup-via' + pickupViaCount);
        var placee2 = new google.maps.places.Autocomplete(newEl, options);
        newInput.push(newEl);