点击第二个按钮，我想要第一个以及第二个按钮变得有颜色

这里我创建了4个按钮。点击后，它应该改变颜色。我想要的是，当我点击第二个按钮时，我想要第一个按钮以及第二个按钮被着色。我该怎么做？点击第二个按钮，我想要第一个以及第二个按钮变得有颜色

<?php 
 
session_start(); 
 
?> 
 
<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<style> 
 
.button { 
 
    
 
    background-color: white; 
 
    border: 1px solid black; 
 
    color: white; 
 
    padding: 8px 30px; 
 
    text-align: center; 
 
    text-decoration: none; 
 
    display: inline-block; 
 
    cursor: pointer; 
 
    float:left; 
 
} 
 
</style> 
 
</head> 
 

 
<body> 
 
<input type="button" class="button" onclick="this.style.backgroundColor = 'red';" value="1"> 
 
<input type="button" class="button" onclick="this.style.backgroundColor = 'yellow';" value="2"> 
 
<input type="button" class="button" onclick="this.style.backgroundColor = 'green';" value="3"> 
 
<input type="button" class="button" onclick="this.style.backgroundColor = 'orange';" value="4"> 
 
</body> 
 
</html>

来源

2017-07-15 Priyal Patel

哪里是你的JavaScript？这和php有什么关系？ – FKEinternet

删除php标签，php将无法帮助，因为它是服务器端。 –

@NoahCristino我相信你的意思是客户端（在用户的浏览器中） - 或者等待 - 你的意思是* PHP *是服务器端？ – FKEinternet

与querySelector()。需要触发点击第一个按钮事件试穿过程中第二个按钮点击

更新

增添了不少色彩untill点击的元素

$('.button').click(function() { 
 
    var that =this; 
 
    $('.button').each(function(){ 
 
    $(this).css('background-color', $(this).attr('data-color')); 
 
    if(that == this){ 
 
    return false; 
 
    } 
 
    }) 
 
})

.button { 
 
    background-color: white; 
 
    border: 1px solid black; 
 
    color: white; 
 
    padding: 8px 30px; 
 
    text-align: center; 
 
    text-decoration: none; 
 
    display: inline-block; 
 
    cursor: pointer; 
 
    float: left; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<body> 
 
    <input type="button" class="button" data-color="red" value="1"> 
 
    <input type="button" class="button" data-color="yellow" value="2"> 
 
    <input type="button" class="button" data-color="green" value="3"> 
 
    <input type="button" class="button" data-color="orange" value="4"> 
 
</body>

来源

2017-07-15 13:51:03 prasanth

同样，如果我点击3按钮，我想第一，第二，第三按钮得到coloured.And通过点击第四按钮，我希望所有的按钮得到coloured.how我可不可以做？？？ –

@PriyalPatel查看我更新的答案 – prasanth

点击第二个按钮，我想要第一个以及第二个按钮变得有颜色

回答

相关问题