顏色選擇器不添加到動態HTML表格

我試圖添加一個顏色選擇器到HTML但它不工作。顏色選擇器不添加到動態HTML表格

小提琴：

這裏是我的代碼：

HTML

<button id="add"> 
    Add to table 
</button> 
</button> 
<table id="points-table" border="1"> 
    <tr> 
    <td>line-item</td> 
    <td>color-picker</td> 
    </tr> 
</table>

jQuery的： -

$(document).ready(function() { 

$('#add').click(function() { 
    alert('clicked') 
    $('#points-table tr:last').after('<tr>' + '<td>1</td>' 

     + '<td> <input class="jscolor" value="ab2567"/> </td></tr>'); 

    }) 


})

來源

2016-09-16 user1050619

你期待什麼發生？ – leigero

你的腳本只在你的表格中添加一行，並給它加上一個硬編碼的值。我不確定這是什麼讓你期望顏色選擇器出現。 – leigero

我編輯了小提琴並添加了新的版本..我希望colorpicker也能顯示在HTML表格中。 – user1050619

你需要得到顏色值使用.val()並將其分配給一個變量。然後在表中使用變量fir輸入值。

見小提琴https://jsfiddle.net/csgn6051/5/

$(document).ready(function() { 
$('#add').click(function() { 
    var color = $('#color').val(); 
    $('#points-table tr:last').after('<tr>' + '<td>1</td>' 
     + '<td> <input class="jscolor" value="'+color+'"/> </td></tr>'); 

    //This part below came from the comment by A. Wolf 
    new jscolor($('#points-table tr:last').find('.jscolor')[0]) 
    }) 
})

來源

2016-09-16 16:34:43

在你的情況，你可以通過這種方式得到的顏色值： $ VAL（）;（ 'jscolor。'）。

但是，我建議你使用一個ID給你顏色選擇部。

來源

2016-09-16 17:01:07

顏色選擇器不添加到動態HTML表格

回答

相關問題