使用bootstrap-datetimepicker，特別是時間，更新多個輸入的更改值？

Question

我正在使用：https://eonasdan.github.io/bootstrap-datetimepicker/#inline

我試圖用隱藏輸入「同步」bootstrap-datetimepicker插件的值。

<script> 
// Initialise the time pickers, on load update the start_time_x_sync values 
function initialiseTimePicker(pickerId) { 
    // Initialise time pickers 
    $(pickerId).datetimepicker({ 
    format:'hh:mm A', 
    inline: true 
    }).on('dp.change', function(e) { 
    // Grab the time value 
    var date = $(pickerId).data('date'); 
    // Populate the hidden inputs for php to process them 
    var syncId = pickerId+'_sync'; 
    $(syncId).val(date); 
    }); 
}; 
// Run it 
$(function() { 
    initialiseTimePicker("start_time_1"); 
    initialiseTimePicker("start_time_2"); 
}; 
</script> 

<label for="start_time_1">START TIME 1</label><br/> 
<div id="start_time_1"></div> 
<input type="hidden" id="start_time_1_sync" name="00:00 AM" /> 

<label for="start_time_2">START TIME 2</label><br/> 
<div id="start_time_2"></div> 
<input type="hidden" id="start_time_2_sync" name="00:00 AM" /> 

這工作得非常好，因爲我有2個在線時間採摘但有是我擊球瞭解這裏的東西。

如果我只使用一個輸入，那麼每次我改變#start_time_1的值，小時/分鐘/上午/下午，它將用時間值更新#start_time_1_sync，例如。 00:00 AM。

當我使用2個輸入並嘗試更改#start_time_1值時，它在#start_time_1_sync中顯示的值爲#start_time_2，似乎卡住了，因爲在此之後它永遠不會改變。但是，如果在那時我更改了#start_time_2的值，那麼每次按照預期進行更改時，#start_time_2_sync都會獲得更新後的值#start_time_2。

所以，在這個例子中，如果只有一個，那麼它的工作原理是1，但是如果有2個，它只適用於第二個。如果有三個，那麼它只適用於第三個。

我怎樣才能讓他們都工作而不會掉頭髮？提前致謝！

編輯：

這裏是dp.change文檔：https://eonasdan.github.io/bootstrap-datetimepicker/Events/#dpchange

Answer 1

由於所有使用相同的函數初始化，在最後傳遞的參數pickerId將所有change事件將接收參數。

嘗試使用this內change： -

function initialiseTimePicker(pickerId) { 
    // Initialise time pickers 
    $(pickerId).datetimepicker({ 
    format:'hh:mm A', 
    inline: true 
    }).on('dp.change', function(e) { 
    // Grab the time value 
    var date = $(this).data('date'); 
    // Populate the hidden inputs for php to process them 
    var syncId = '#' + this.id +'_sync'; 
    $(syncId).val(date); 
    }); 
}; 

，我以爲你應該在參數中使用#？

initialiseTimePicker("#start_time_1"); 
initialiseTimePicker("#start_time_2"); 

此外，它的值得探討關閉。