我想要做的是有三個按鈕,都具有相同的文本列表,但是當每個按鈕被點擊時,只有一定數量的行中的文本行是其他顏色設置的默認顏色。使用javascript與按鈕來改變文本的顏色(列表)
例如..
按鈕一個5/10彩色 兩個按鈕7/10彩色 三個按鈕10/10,有色
基本上這個東西
https://www.hubspot.com/pricing/marketing
感謝狀
我想要做的是有三個按鈕,都具有相同的文本列表,但是當每個按鈕被點擊時,只有一定數量的行中的文本行是其他顏色設置的默認顏色。使用javascript與按鈕來改變文本的顏色(列表)
例如..
按鈕一個5/10彩色 兩個按鈕7/10彩色 三個按鈕10/10,有色
基本上這個東西
https://www.hubspot.com/pricing/marketing
感謝狀
下面是我相信你問的一個粗略例子爲...而努力。
<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>
非常感謝:) –
@TonyP:如果它解決了您的問題,請接受答案。閱讀更多:https://stackoverflow.com/help/someone-answers –
[歡迎StackOverflow的,請查看此網頁。(https://stackoverflow.com/help/how-to-ask) – Editor
歡迎堆棧溢出。請回顧[我如何問一個好問題](https://stackoverflow.com/help/how-to-ask)。你已經嘗試過什麼了?這不是一個代碼寫作或輔導服務。問題應該顯示**研究證據和嘗試自己解決問題**,清楚地列出您的特定編碼相關問題以及[最小,完整和可驗證示例]中的任何相關代碼(https:// stackoverflow .com/help/mcve),所以我們有足夠的信息能夠提供幫助。 – FluffyKitten