从前一个span元素中获取样式

时间:2013-09-27 15:29:52

标签: javascript jquery html css

使用jquery,我希望从被点击的spzn之前获取rgb颜色代码。

我可以通过以下方式获得点击次数:

$(document).ready(function(){
  $( "#myDiv :radio").click(function(){
    alert("Got here");
    });
});

那么,如何在单选按钮之前使用类swatchColour_1从范围中获取rgb代码#000000。

对于不同的颜色,大约有30个li元素。我实际可以改变的唯一代码是id =“myList”的第一个div

<div class="productAttributeList" id="myList" style="">
    <div class="productAttributeRow xx" id="ffb492067dcd98c19b6be89e9230f4fc">
        <div class="productAttributeLabel">
            <label for="06b0854950dd6cc1d296718965c0d36a">
                <span class="required">*</span>
                    <span class="name">Color choice:</span>
            </label>
        </div>
        <div class="productAttributeValue">
            <div class="productOptionPickListSwatch">
                <ul>
                    <li class="swatch hasPreview swatchOneColour">
                        <label for="0780a439a3a2ec8492a8772f4f5d739a">
                        <span class="previewContent">
                            <span class="swatchColours swatchOneColour showPreview" title="Black - 070">
                                <span class="swatchColour swatchColour_1" style="background-color:#000000;">&nbsp;</span>
                                </span>
                            </span>
                            <input type="radio" class="validation" name="attribute[119]" value="195" id="0780a439a3a2ec8492a8772f4f5d739a"  />
                            <span class="name">Black - 070</span>
                        </label>
                    </li>

。 。

谢谢Gary

2 个答案:

答案 0 :(得分:1)

您可以使用.prev().find().css()方法:

$( "#myList input[type=radio]").change(function() {
    var color = $(this).prev().find('.swatchColour_1').css('background-color');
});

或使用.closest()方法:

var color = $(this).closest('.previewContent')
                   .find('.swatchColour_1')
                   .css('background-color');

http://api.jquery.com/

答案 1 :(得分:1)

$(document).ready(function(){
  $( "#myDiv :radio").click(function(){
    alert($(this).prev("span.previewContent").find(".swatchColour_1").css("background-color"));
    });
});
相关问题