0

请朋友们帮我解决这个小问题。我正在使用 opencart，我的产品要求买家在添加购物车之前选择颜色。

通常我们使用带有 href 的 LI 来制作带有 onclick 选择的颜色框，但是由于 Opencart 只允许此类要求的表单元素，即选择、检查、单选等，因此我使用带有 CSS 的单选按钮。它在 Mozilla、Chrome 甚至 IE9 上都能正常工作....但在 IE8 和 IE7 上却不行 :(

这是编译后的单选按钮的HTML

<div class="option Color" id="option-227">
<span class="required">*</span>
<h2>Color:</h2><br>

<div class="colorOption-Holder">
<input type="radio" id="option-value-18" value="18" name="option[227]">
<label for="option-value-18">
<img src="../images/Swatches/Green-25x25.gif" alt="Green" title="Green">
</label>
</div>

<div class="colorOption-Holder">
<input type="radio" id="option-value-18" value="18" name="option[227]">
<label for="option-value-18">
<img src="../images/Swatches/Blue-25x25.gif" alt="Blue" title="Blue">
</label>
</div>

</div>

这是CSS

.product-info .Color .colorOption-Holder {
float:left;
width:35px;
height:35px;
margin-right:7px;
margin-bottom:9px;
position:relative;
}
.product-info .Color input{
position:absolute;
left:5px;
top:10px;
visibility:hidden;
z-index:5;
}

.product-info .Color input + label {
position:absolute;
left:0;
top:0;

border:1px solid #fff;
}

.product-info .Color input:checked + label {
position:absolute;
left:0;
top:0;
z-index:5;
border:1px solid #f76a02;
}

任何想法如何解决这个问题？这将是一个很大的帮助......谢谢

4

2 回答 2

1

internet explorer 8（和以前的版本）不支持许多 CSS 选择器。:checked 伪类就是其中之一。

查看这个类似的帖子以获取名为Selectivizr的解决方案，该解决方案允许您为不同的 IE 版本添加选择器支持。

当您不坚持使用“通常”的选择器时，您应该检查quirks-mode以了解浏览器对不同选择器的支持。

于 2012-09-11T20:27:48.220 回答
0

结束标签在代码中，但我不知道为什么它们没有显示在这里是来自 product/product.tpl 文件的代码

<?php foreach ($option['option_value'] as $option_value) { ?>
<div class="colorOption-Holder">
<input type="radio" name="option[<?php echo $option['product_option_id']; ?>]" value="<?php echo  $option_value['product_option_value_id']; ?>" id="option-value-<?php echo $option_value['product_option_value_id']; ?>" />
<label for="option-value-<?php echo $option_value['product_option_value_id']; ?>">
<img src="<?php echo $option_value['image']; ?>" />
 <?php if ($option_value['price']) { ?>
(<?php echo $option_value['price_prefix']; ?><?php echo $option_value['price']; ?>)
<?php } ?>
</label>
</div>
<?php } ?>
于 2012-09-11T20:19:26.960 回答