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

Display Hex Code on Page load

本文关键字：显示 十六进制 代码 加载      更新时间：2023-09-26

正确的工作代码可以在回复中看到。最终结果: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块上的以显示十六进制代码。我想让它直接显示

这可能吗?如果有，那是怎么回事?

谢谢大家!

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') + '" />');
    });
});

小提琴

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

同样，使用inspect元素也会显示代码执行了它所告诉它的并将##放在颜色的前面。

相关文章：