0

可以用图像更改标签的文本吗？例如，#unaesstrella 有文本“UnaEstrella”，我想要明文（或简单地添加带有填充或类似内容的图像）并显示来自http://www.domain.com/images/unaestrella.png的图像。这可能吗？

<ul class="radio_list">
    <li>
        <label for="unaestrella">
            <input id="unaestrella" type="radio" value="unaestrella" name="topics"/>
            UnaEstrella
        </label>
    </li>
    <li>
        <label for="dosestrellas">
            <input id="dosestrellas" type="radio" value="dosestrellas" name="topics"/>
            DosEstrellas
        </label>
    </li>
</ul>
4

3 回答 3

2

是的，这是可能的，但使用 aclass是label因为你已经使用了 the#unaestrella并且an必须是唯一的，一个必须分配给一个元素。idinputIDID

CSS：

.unaestrella{
    background : url('https://m.dominos.co.uk/m/iphone/assets/img/common/icon-single-small.png') no-repeat right;
    padding: 0 25px 0 0;
    cursor:pointer;
}

HTML;

<label class="unaestrella" for="unaestrella">
    <input id="unaestrella" type="radio" value="unaestrella" name="topics" />
</label>

例子。

于 2013-10-06T21:46:22.543 回答
1

像这样添加一个<img/>元素<label/>：

在 html ( http://jsfiddle.net/kyjey/ )

<ul class="radio_list">

    <li>
        <input id="unaestrella" type="radio" value="unaestrella" name="topics"/>
        <label for="unaestrella">
            <img src="http://www.buscatuspa.com/wp-content/themes/Avada/images/unaestrella.png"/>
        </label>
    </li>

</ul>

使用 jQuery ( http://jsfiddle.net/kyjey/2/ )编辑以符合作者要求

$(function() {
    $('#unaestrella').next('label').empty().append('<img src="http://www.buscatuspa.com/wp-content/themes/Avada/images/unaestrella.png"/>');
})
于 2013-10-06T21:48:51.220 回答
0

我可以用css解决这个问题：

ul.radio_list li label[for=unaestrella] {position:relative !important;float:left !important;line-height:25px !important;background-image:url(images/unaestrella.png);background-position:top left;background-repeat:no-repeat !important; width:100% !important;color:transparent !important;}

但是jQuery可以删除文本吗？

于 2013-10-06T21:56:30.970 回答