Question

如何创建切换按钮以添加内联样式？

例如，在这个简单的结构中，我想制作一个切换按钮来显示或隐藏div 我不想添加类名或只使用 .show（） 和 .hide（） jQuery的

我需要它为内联样式例如如果我切换按钮我希望它添加此样式

style="display:block color:red;"

如果再次切换

style="display:none"

<button>toggle</button>

<div>blah bla blah</div>

Answer 1

尝试以下代码...

solution = Solution('cocoa')
solution.process('c')
solution.process('o')
solution.process('c')
solution.process('o')
assert solution.count == 0
solution.process('c')
solution.process('o')
solution.process('a')
assert solution.count == 1
print('First test passed')

solution.count = 0
solution = Solution('acbcc')
stream = 'acbcbcc'
for a in stream:
  solution.process(a)
assert solution.count == 0
print('Second test passed')

JavaScript代码......

<button id="button">toggle</button>

<div id="div">blah bla blah</div>

直播{{3}}

快乐的编码......：）

Answer 2

您可以使用.css("display")检查切换样式。然后根据需要设置属性

$("button").click(function(){
        if($("div").css("display") == "none") {
             $("div").css({"display":"block","color":"red"});
        }
        else{
            $('div').css("display","none");
        }
    });

Answer 3

使用自定义类和A::Hello

func

Answer 4

简化切换版本

div.style.display=div.style.display==='none'?'block':'none';

片段

var button=document.getElementById("button");
var div=document.getElementById("div"); 
  button.onclick=function (){
div.style.display=div.style.display==='none'?'block':'none';<-----single line

}

<button id="button">toggle</button>
<div id="div">blah bla blah</div>

用于添加内联样式的jQuery / JavaScript切换按钮

4 个答案: