Question

我在.hta文件中有一些类application.html.erb的div。单击特定div后，我需要将其边框更改为3px和红色。当选择不同的div时，我需要将原始div恢复为原始样式（1px黑色边框）， ALSO 将第二个div的边框更改为3px红色。

基本上一次只有一个div可以是红色。

纯JavaScript比jQuery更受欢迎。我假设我需要将一个类应用于单击的div，如果选择了另一个div，则将其从此类中删除，同时将第二个div添加到类或其他内容中？

所有div都有类trashitem，但每个div都引用了一个独特的函数onclick，见下文：

trashitem

更新代码

JAVASCRIPT

<div class="trashitem" onclick="Writedata13()">
   <div class="photobox">
      <img src="http://www.fakeImage.JPG">
   </div>
</div>

<div class="trashitem" onclick="Writedata14()">
   <div class="photobox">
      <img src="http://www.fakeImage.JPG">
   </div>
</div>

<div class="trashitem" onclick="Writedata15()">
   <div class="photobox">
      <img src="http://www.fakeImage.JPG">
   </div>
</div>

HTML

<script language="javascript">
function Writedata14(event)
{
 var a = event.target;  
 a.style.cssText = 'width:330px;height:10px;background-color:black';  
}
</script>

链接到Codepen demo: http://codepen.io/anon/pen/LVvvME。

Answer 1

您可以使用

获取要点击的元素

 event.target;

你可能会做类似

的事情

<script type="text/javascript">
        function Writedata13(){
             var a = event.target;  
             a.style.cssText = 'width:330px;height:10px;background-color:black';          
        }
</script>

请参阅此内容以获取有关它的更多信息 http://www.w3schools.com/jsref/event_target.asp

单击时更改div的样式，并在单击另一个div时将其更改回来

1 个答案: