Question

可以在回复中看到正确的工作代码。最终结果：http://www.creativewebgroup.co.uk/library/colorshareV2/palette/Android

我正在尝试制作调色板脚本。

我有这个jQuery脚本：

<script>
//document ready
$(document).ready(function () {
$('.palette-detail li').each(function () {
    $(this).html('<input type="text" style="background: #' + $(this).attr('swatch') +    '" />' );
});
$('.palette-detail').click(function (e) {
    var elem = e.target;
    if ($(elem).is('input')) {
        $(elem).val($(elem).parent().attr('swatch'));       
    }
   });
});

以下是使用HTML的基本概念（在脚本中，但它是由PHP驱动的）。

<ul class="palette">
<li swatch="#FFFFFF">
<li swatch="#FFFFFF">
<li swatch="#FFFFFF">
<li swatch="#FFFFFF">
<li swatch="#FFFFFF">
<span><a href="palette/URL">Title</a></span>
</ul>

目前脚本要求用户在li块上单击以显示十六进制代码。我想让它直接显示。

这可能吗？如果是这样的话？

谢谢一群人！

Answer 1

<强> HTML

<ul class="palette">
<li swatch="#4362ff">
<li swatch="#ee3d5f">
<li swatch="#FFFFFF">
<li swatch="#FFFFFF">
<li swatch="#FFFFFF">

</ul><span><a href="palette/URL">Title</a></span>

jQuery

     //document ready
$(document).ready(function () {
    $('.palette li').each(function () {
        $(this).html('<input value='+$(this).attr("swatch")+' type="text" style="background: ' + $(this).attr('swatch') + '" />');
    });
});

fiddle

代码中有很多错误。您没有为UL选择正确的类。此外，UL元素不能包含span个元素。

同样使用inspect元素会显示代码执行的操作并将##放在颜色的前面。

在页面加载上显示十六进制代码

1 个答案: