Question

我有一些输入，例如：

<input name="binValue" value="Grey" type="hidden">

这是隐藏的。我想，根据隐藏输入的值，显示一个彩色方块而不是简单的文字，表示＆＃34; Gray＆＃34;。

与亚马逊如何显示彩色方块here一样。

在他们左侧的改进中。

我使用的HTML是：

<input name="binValue" value="Grey" type="hidden">
<a href="hostedbywebstore.com/s?field_color_map=Grey&amp;ie=UTF8&amp;refinementHistory=subjectbin%2Csize_name%2Cbrandtextbin%2Ccolor_map%2Cprice%2Ccollection_name-bin&amp;searchBinNameList=subjectbin%2Csize_name%2Cbrandtextbin%2Ccolor_map%2Cprice%2Ccollection_name-bin&amp;searchKeywords=*&amp;searchNodeID=5444386011&amp;searchRank=salesrank&amp;searchSize=12" rel="nofollow">                       
    <input type="checkbox">Grey    
</a>

谢谢。

Answer 1

添加CSS类

.Grey{
    display: inline-block;
    background-color: #CCC; /* or some other grey value you like */
    width: 15px;
    height: 15px;
}

更改您的复选框

<input type"checkbox"><div class="Grey">&nbsp;</div>

你也可以改变它，所以没有复选框，div就是chackbox。

Answer 2

var color = $('input:hidden').val();

这里你将获得隐藏的输入值，即灰色

你写了像

这样的CSS

.Gray{background:#ccc}

比添加类

$('a').addClass(color);或

$('input[type="checkbox"]').parent().addClass(color);

基于输入值的样式

2 个答案: