更改可点击折叠的颜色实现

我想仅在单击折叠标题时更改可折叠标题的颜色。更改可点击折叠的颜色实现

<div class="collapsible-header" onclick="connect()"></div>

我要补充类元素中的颜色，我真的不知道该如何添加一些内容时，我称之为“连接” funtion。这可能吗？

谢谢！

具有以下但不工作

HTML

<div class="collapsible-header" onclick="connect(this)">Robot</div>

而且在JS试图

function connect(element) 
{ 
    element.style.color = 'red'; 
    if (connection_status == 0) 
    { 
     client.connect(options); 
    }; 
}

来源

2017-07-26 Olivia Delpierre

分享你的代码是什么，你试过了吗？ –

https://jsbin.com/sojefubudo/edit?html,js,console,output

<div class="collapsible-header" onclick="connect(this)"></div>

而且在javascript：

function connect(element) { 
    element.style.color = 'red'; 
}

来源

2017-07-26 12:53:52

我编辑了我的问题，它似乎没有工作... –

你得到错误或是别的东西？ –

我做错了什么，现在它完美的工作谢谢你！你有任何想法如何改变可折叠的背景颜色，而不是其内容的颜色？ thanksss –

<div class="collapsible-header" onclick="javascript:this.className += ' additionalClass'"></div>

来源

2017-07-26 12:51:32 codegeek

采取一个新的类，并指定要追加然后样式做这个

$(".collapsible-header").click(function(){ 
    $(".collapsible-header").toggleClass("NEWCLASS"); 
});

来源

2017-07-26 13:02:06

对此拨弄一下：

https://jsfiddle.net/swarn_singh/9a6djpwp/

<div onclick="this.style.color = 'red'"> 
Change color with inline javascript 
</div> 

<div onclick="changeColor(this)"> 
Change color with javascript function 
</div> 

<script> 
    function changeColor(element){ 
     element.style.color = 'blue'; 
    } 
</script>

来源

2017-07-26 13:32:07

使用ToggleClass获得更好的效果

(function(){ 
 
    $("#run").click(()=>{ 
 
     //$(this).css('background','yellow'); 
 
     $("#run").toggleClass('yellow'); 
 
    }); 
 
}());

.yellow { 
 
    background: yellow!important; 
 
} 
 

 
.red { 
 
    background:red; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="run" class="red" style="position:absolute;height:100px;width:10px;"></div>

来源

2017-07-26 13:57:44 Prabhakaran

更改可点击折叠的颜色实现

回答

相关问题