CSS,如果html是值,则改变颜色

时间:2010-07-15 14:36:09

标签: jquery css

抱歉由于不清楚,我的意思是这个。

目前在页面加载时,我获取具有特定ID的链接,我检查我的数据库,然后json将结果返回到链接。所以基本上:

<a href="#" class="switcher" id="Site_Gallery-<?php echo $item->id; ?>">...loading....</a>

成为:

<a id="Site_Gallery-563" class="switcher" href="#">Enabled</a>

<a id="Site_Gallery-563" class="switcher" href="#">Disabled</a>

我想要的是CSS,或者可能在ajax调用(不理想)上查看该值,然后将链接颜色设置为绿色或红色。

我认为在CSS中可能还有待办事项

.switcher='Enabled' {
  color: green;
} .switch='Disabled' {
  color: red;
}

这有什么诀窍吗?请感谢您的答案到目前为止

7 个答案:

答案 0 :(得分:3)

非常确定你不能用直接的CSS检查元素的值。在jQuery中它看起来像:

$(function(){
    $(".switcher").each(function(){
        if ($(this).text() == "Enabled"){
            $(this).addClass("enabled");
        } else {
            $(this).removeClass("enabled");
        }
    });
});

然后在CSS中你可以找到“启用”类而不是“裸”切换器类:

.switcher{
    color:red;
}

.switcher.enabled{
    color:green;
}

答案 1 :(得分:1)

 val =  $('#toggleElement').val()
  if(val!==''){
   $('#toggleElement').css('color','green')
}

答案 2 :(得分:1)

也许

$('a[enabled]').css('color', 'green');

是朝着正确方向迈出的一步,或者

$('a[enabled=true]').css('color', 'green');

答案 3 :(得分:1)

您可能正在寻找:active:focus伪选择器。

答案 4 :(得分:0)

试试这个:

$('a#id').change(function() {
   $(this).css('color', 'green');
});

但是它不起作用,因为你不能“改变”超链接html,而不是没有另一个脚本。函数change旨在与文本输入一起使用,如表格

中的那些

希望我有所帮助。

编辑:得到你的意思(我认为)。如果启用,则表示当鼠标位于链接上时,css伪类:hover可以很好地完成此操作。在google上查看它,你会得到大量的结果

答案 5 :(得分:0)

有些情况

如果enabled表示

  • 鼠标:使用CSS a#id:hover{...}
  • 鼠标单击:使用CSS a#id:active{...}
  • 您当前正在查看链接的内容:您需要在点击链接后使用jQuery添加类( if ajax )。或者以某种方式解析网址,将其与链接的href匹配并为其添加一个类(不建议使用..更好地使用服务器端脚本..

答案 6 :(得分:-1)

有关如何使用css设置链接样式的页面:http://www.echoecho.com/csslinks.htm