Question

我有一个列出元素的网格，我的目的是随机化他们的加载背景颜色。到目前为止，所有元素都具有相同的背景（thumbnailBackgroundColor），这在HTML文件中设置如下：

<head>
<script type="text/javascript" src="java/FWDIGP.js"></script>    

<script type="text/javascript">    

    FWDRLUtils.onReady(function(){    
        new FWDIGP({        
            thumbnailBackgroundColor:"#111111"     
            });
        });
</script>

正文中的网格编码如下：

<ul>
<li data-thumbnail-path="content/media/thumbnails/1.jpg" data-url="content/media/images/1.jpg" data-thumbnail-overlay-color="">
    <div>
        <p class="gallery1DecHeader">my description</p>  
    </div>                                
</li>
</ul>

这是JavaScript上的函数

this.setupPoolThumbs = function() {
        for (var o = 0; o < this.maxThumbs; o++) {
            FWDIGPThumb.setPrototype();
            e = new FWDIGPThumb(this, this.thumbnailTransitionType_str, this.thumbnailBackgroundColor_str, this.thumbnailOverlayBackgroundColor_str, n.thumbnailOverlayOpacity, n.showThumbnailOverlay_bl, this.isMobile_bl, n.showThumbnailIcon_bl, i.disableThumbnailInteractivity_bl);
            e.setVisible(false);
            e.addListener(FWDIGPThumb.MOUSE_OVER, this.onMouseOverHandler);
            e.addListener(FWDIGPThumb.MOUSE_UP, this.onMouseUpHandler);                
        }
    };

我如何随机化thumbnailBackgroundColor属性？

Answer 1

Javascript能够使用toString()函数将整数转换为base-16（十六进制）字符串。您可以使用此特定函数生成随机数，然后将其转换为有效的十六进制颜色字符串。

以下是基本代码（由Paul Irish提供）：

'#'+Math.floor(Math.random()*16777215).toString(16);

您可以将此内联放置在构造函数中，因此您的代码将如下所示：

FWDRLUtils.onReady(function(){    
    new FWDIGP({        
        thumbnailBackgroundColor: '#'+Math.floor(Math.random()*16777215).toString(16)
    });
});

我如何随机化HTML元素的颜色属性？

1 个答案: