使用javascript与按钮来改变文本的颜色（列表）

-1

我想要做的是有三个按钮，都具有相同的文本列表，但是当每个按钮被点击时，只有一定数量的行中的文本行是其他颜色设置的默认颜色。使用javascript与按钮来改变文本的颜色（列表）

例如..

按钮一个5/10彩色两个按钮7/10彩色三个按钮10/10，有色

基本上这个东西

https://www.hubspot.com/pricing/marketing

感谢状

来源

2017-10-15 Tony P

[欢迎StackOverflow的，请查看此网页。（https://stackoverflow.com/help/how-to-ask） – Editor

欢迎堆栈溢出。请回顾[我如何问一个好问题]（https://stackoverflow.com/help/how-to-ask）。你已经尝试过什么了？这不是一个代码写作或辅导服务。问题应该显示**研究证据和尝试自己解决问题**，清楚地列出您的特定编码相关问题以及[最小，完整和可验证示例]中的任何相关代码（https：// stackoverflow .com/help/mcve），所以我们有足够的信息能够提供帮助。 – FluffyKitten

下面是我相信你问的一个粗略例子为...而努力。

<html> 
<style> 
    .selected { 
     background-color: yellow; 
    } 
</style> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     $('#btn1').click(function() { 
     setSelected(1, 3); 
     }); 
     $('#btn2').click(function() { 
     setSelected(1, 6); 
     }); 
     $('#btn3').click(function() { 
     setSelected(1, 9); 
     }); 
    }); 

    function setSelected(lower, upper) { 
     for(var i = lower; i <= upper; i++) { 
      $('#itm' + i).addClass('selected'); 
     } 
     for(var i = upper+1; i <= 9; i++) { 
      $('#itm' + i).removeClass('selected'); 
     } 
    } 
</script> 
<input id="btn1" type="button" value="Button 1"/> 
<input id="btn2" type="button" value="Button 2"/> 
<input id="btn3" type="button" value="Button 3"/> 
<ol> 
    <li id="itm1">Item 1</li> 
    <li id="itm2">Item 2</li> 
    <li id="itm3">Item 3</li> 
    <li id="itm4">Item 4</li> 
    <li id="itm5">Item 5</li> 
    <li id="itm6">Item 6</li> 
    <li id="itm7">Item 7</li> 
    <li id="itm8">Item 8</li> 
    <li id="itm9">Item 9</li> 
</ol> 
</html>

来源

2017-10-15 06:12:01 BHolb

非常感谢:) –

@TonyP：如果它解决了您的问题，请接受答案。阅读更多：https://stackoverflow.com/help/someone-answers –

使用javascript与按钮来改变文本的颜色（列表）

回答

相关问题