颜色选择器不添加到动态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表格

回答

相关问题