小编Aus*_*ner的帖子

只有event.target的目标父级？

HTML:

<div onclick="doSomething()" id="parent">
    <div id="child"></div>
</div>

Run Code Online (Sandbox Code Playgroud)

CSS:

#parent {
    background-color: blue;
    width: 100%;
    height: 100px;
}

#child {
    background-color: green;
    width: 50%;
    height: inherit;
}

.myClass {
    background-color: red !important;
}

Run Code Online (Sandbox Code Playgroud)

JS:

function doSomething() {
    event.target.className = ('myClass');
}

Run Code Online (Sandbox Code Playgroud)

正如您在此JSFIDDLE中所看到的,在单击子项时,不是将该类应用于触发该函数的父项,而是将其应用于子项.我想知道如何避免这种情况并将其应用于父母,无论我在哪里点击它.我试图避免使用该document.getElement(s)ByClass/Id方法.
有帮助吗？

javascript javascript-events

Aus*_*ner

2015 08-20

6
推荐指数

1
解决办法

7009
查看次数

防止在后台滚动

function openNav() {
  document.getElementById('UI').className = "open";
}

function closeNav() {
  document.getElementById('UI').className = "closed";
}

Run Code Online (Sandbox Code Playgroud)

body {
  font-family: monospace;
  padding: 75px;
  word-wrap: break-word;
}
#UI {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transition: all .5s;
}
#UI.closed {
  background-color: rgba(255, 255, 255, .0);
}
#UI.open {
  background-color: rgba(05, 55, 105, .75);
}
#UI button {
  font-size: 30;
  width: 50px;
  height: 50px;
  border: 0;
  outline: 0;
  color: white;
  background-color: blue;
  transition: all .5s;
  cursor: pointer;
  position: fixed;
} …

Run Code Online (Sandbox Code Playgroud)

javascript scroll

Aus*_*ner

lucky-day

5
推荐指数

1
解决办法

52
查看次数