首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >iCheck -设置同级的颜色

iCheck -设置同级的颜色
EN

Stack Overflow用户
提问于 2015-12-24 17:05:51
回答 2查看 3.4K关注 0票数 3

我正在使用jQuery库'iCheck‘作为输入,对于那些回答良好的问题,我正在尝试将标签的颜色设置为绿色。当我不使用iCheck时,一切都可以完美地工作,但当我使用该库时,我的脚本似乎没有任何效果。我做错了什么?

HTML文档

<div class="radio" >
  {% if answer.is_valid == True %}
  <input type="radio" name="question-{{ question.id }}" id=" {{answer.text}}">
  {% else %}
  <input type="radio" name="question-{{ question.id }}" id="{{answer.text}}">
  {% endif %}
    <label><b>{{ answer.text }}</b></label>
</div>

JS

$('.check').click( function () {
    var score = 0
    var all = $('input[id^=" "]');
    var checked = $('input:checked');
    var good = $('input:checked[id^=" "]');

    checked.siblings().css('color', 'red');
    all.siblings().css('color', 'green');
    good.each ( function(){
        score += 1;
    })

    alert(score);
    score = 0;
});
EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2015-12-24 17:19:46

这是因为icheck以这样一种方式更改了DOM,您的原始输入甚至不再可见。检查DOM浏览器,查看iCheck是否更改了您的

<input type="radio" name="question-{{ question.id }}" id=" {{answer.text}}">

<div class="iradio_flat-pink" aria-checked="false" aria-disabled="false" style="position: relative;">
<input type="radio" name="question-1" id="text" style="position: absolute; opacity: 0;">
<ins class="iCheck-helper" style="position: absolute; top: 0%; left: 0%; display: block; width: 100%; height: 100%; margin: 0px; padding: 0px; background-color: rgb(255, 255, 255); border: 0px; opacity: 0; background-position: initial initial; background-repeat: initial initial;">
</ins>
</div>

或者类似的东西。

要更改元素的颜色,您需要使用iCheck函数,并为其提供不同的类:

$('#input1').iCheck({
    radioClass: 'radio-green' //or something you like.
});
票数 2
EN

Stack Overflow用户

发布于 2018-06-08 07:00:14

尝尝这个!

$( document ).ready(function () {        
    if ($("input.flat")[0]) {
        $(document).ready(function () {
            $('input.flat').iCheck({
                checkboxClass: 'icheckbox_flat-blue',
                radioClass: 'iradio_flat-blue'
            });
        });
    }
});
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/34450092

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档