將jquery插件附加到文檔

我正在使用一個名爲minicolors的jquery link插件。我試圖在這裏用一個按鈕點擊一個顏色選擇器（在2個地方，一個div和一個表格用於測試），但似乎它只適用於第二個按鈕點擊，第一個簡單地返回一個空的輸入框。將jquery插件附加到文檔

 <script type="text/javascript"> 


      function addPicker() { 

      $(document).ready(function() { 
          $(".colorpick").miniColors({ 
       change: function(hex, rgb) { 

        } 
       }); 
      }); 

       var picker = "<input type= 'text' class='colorpick' size='6' autocomplete='on' maxlength='10' value='' />"; 

       $("#datatable > tbody").append("<tr><td>"+picker+"</td></tr>"); 
       $("#testdiv").append(picker); 
      } 



      </script> 
      <div id="testdiv"></div> 
      <button onclick =" addPicker();">Button</button>

不知道爲什麼這不起作用。

來源

2012-07-23 Kza

刪除的document.ready，並嘗試這種方式。 – Pabuc 2012-07-23 12:44:07

請在jsFiddle中發佈這個:)據我所見，你的代碼中已經有一些奇怪的東西了。（例如..爲什麼在函數中調用$（document）.ready（）??） – Yoeri 2012-07-23 12:45:04

嘗試：

$(document).ready(function() { 

     $('.addButton').click(function(){ 
      $("<input type= 'text' class='colorpick' size='6' autocomplete='on' maxlength='10' value='' />").appendTo("#datatable tbody").wrap('<tr><td></td></tr>'); 

      $('.colorpick').miniColors(); 
     }); 

    });

現場演示：從功能http://jsfiddle.net/hCVpX/12/

來源

2012-07-23 12:51:48 tekilatexee

這真的很接近但實際的顏色框選取器不顯示。它仍然有最多的功能，但是 – Kza 2012-07-23 13:04:25

請你再試一次。您必須在按鈕上添加「addButton」類。 – tekilatexee 2012-07-23 13:32:03

是的，這個選擇框現在正在顯示，但是它沒有被添加到與輸入框相同的單元格中，它只是附加到底部表體而沒有坐在任何表格單元格或行中 – Kza 2012-07-23 16:53:26

將jquery插件附加到文檔

回答

相關問題