jQuery datepicker不適用於多個實例

Question

我試圖在每次選擇Google地圖中的某個地方時創建新的datepicker。

  $(function(){$(".datepick").datepicker({ 
       dateFormat : "yyyy-MM-dd" 
       }); 
      }); 

    var tomakedate = document.getElementById("fordate"); 

這是在html上添加一個新的日期選擇器的事件。

    selectedplacessize = selectedplaces.length; 
        inputcal = document.createElement("input"); 
        inputcal.type = "text"; 
        inputcal.name = "datepicker" + selectedplacessize; 
        inputcal.setAttribute("id","datepicker" + selectedplacessize); 
        inputcal.className = "datepick hasDatepicker"; 
        tomakedate.appendChild(inputcal); 

在瀏覽器中，帶有新添加的datepicker的html看起來像這樣。

  <td id="fordate"> <input type="text" id="inputlatlong" name="inputlatlong" hidden=""> 
     <input type="text" id="datepicker" name="datepicker" class="datepick hasDatepicker"> 
     <input type="text" name="datepicker1" id="datepicker1" class="datepick hasDatepicker"></td> 

帶有id＃datepicker的輸入元素將在頁面加載時出現。每次在谷歌地圖上選擇一個地方時，都會添加另一個類別爲「datepick」的輸入類型。 瀏覽器的檢測元素沒有錯誤或警告。

編輯：我試圖替換行：

inputcal.className = 「datepick hasDatepicker」;與

inputcal.className =「datepick」;

它仍然無法正常工作。

Answer 1

您正在做$('.datepick').datepicker();之前這些元素與datepick類存在。 之後添加的新元素而不是將被轉換爲日期選取器，因爲它僅指在當時處滿足選擇器的元素。

我喜歡用這樣的事情的比喻就是我所稱的百貨比喻：

比方說，你在百貨公司工作。你的經理說：「把一個紅色的貼紙放在玩具部門的所有東西上」 - 然後你就這麼做。第二天，有100個新玩具進來。你的經理立即向你問道：「爲什麼新玩具沒有紅色貼紙？」

這與您在此處詢問的內容類似。您正在將目前爲.datepick的所有元素轉換爲日期選擇器，但是如果創建了新元素，則不會轉換它們。

您可以修改代碼以使元素datepickers，因爲它們可以通過執行以下操作創建：

selectedplacessize = selectedplaces.length; 
inputcal = document.createElement("input"); 
inputcal.type = "text"; 
inputcal.name = "datepicker" + selectedplacessize; 
inputcal.setAttribute("id","datepicker" + selectedplacessize);  
inputcal.className = "datepick hasDatepicker"; 
tomakedate.appendChild(inputcal); 

$inputcal = $(inputcal); 
$inputcal.datepicker({dateFormat : "yyyy-MM-dd"});