个人中心
文章发布
退出
作者热门文章
- android - 多次调用 OnPrimaryClipChangedListener
- android - 无法更新 RecyclerView 中的 TextView 字段
- android.database.CursorIndexOutOfBoundsException : Index 0 requested, 光标大小为 0
- android - 使用 AppCompat 时，我们是否需要明确指定其 UI 组件(Spinner、EditText)颜色
24
4
我有一个将用作菜单的网格，它由一个 ul 制成的顶行组成，其中 3 个 li 设置为显示:内联 block 在这些 li 的每一个中都有一个 ul，在这 4 个 li 的下面。我已经分配了一个事件监听器来响应点击内部 ul 下的 li，类是“inner”。
您可以在此处查看代码:http://jsfiddle.net/jimeast123/qK2Ju/2/当我单击前 2 列中的元素时(您需要避免单击文本)，当我单击第三列时，我收到了预期的警报消息，但没有任何响应。我尝试过使用不同数量的列，但最后一列从不响应。
我的代码:html
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>drop down</title>
<style>
body {
margin: 0;
padding: 0;
}
header {
height: 120px;
background-color: #eef;
}
.top {
background-color: #fee;
}
.top li {
display: inline-block;
width: 5.5em;
height: 1.5em;
border: 1px solid black;
text-align: center;
}
li {
list-style: none;
}
.inner {
margin-left: -2.55em;
display:block;
}
li a {
text-decoration: none;
}
.inner li {
display: block;
text-align: center;
background-color: #efe;
}
</style>
</head>
<body>
<!-- heading>h1+nav>ul.top>li*5>(a[href=#]>{menu$})>ul.inner>li*4>a[href=#]>{menu$} -->
<header>
<nav>
<header>
<nav>
<ul class="top">
<li><a href="#">menuA</a>
<ul class="inner" id="one">
<li><a href="#">item1</a></li>
<li><a href="#">item2</a></li>
<li><a href="#">item3</a></li>
<li><a href="#">item4</a></li>
</ul>
</li>
<li><a href="#">menuB</a>
<ul class="inner" id="two">
<li><a href="#">item1</a></li>
<li><a href="#">item2</a></li>
<li><a href="#">item3</a></li>
<li><a href="#">item4</a></li>
</ul>
</li>
<li><a href="#">menuE</a>
<ul class="inner" id="five">
<li><a href="#">item1</a></li>
<li><a href="#">item2</a></li>
<li><a href="#">item3</a></li>
<li><a href="#">item4</a></li>
</ul>
</li>
</ul>
</nav>
</header>
</nav>
</header>
<script src="dropdown.js"></script>
</body>
</html>
JavaScript:
if (document.body.addEventListener) {
document.body.addEventListener('click', theHandler, false);
} else {
document.body.attachEvent('onclick', theHandler); //for IE
}
function theHandler(e){
e = e || window.event;
var target = e.target || e.srcElement;
if (target.className.match(/inner/)) {
//console.log("inner class was clicked");
alert("inner class was clicked");
}
}
最佳答案
用户实际上不能点击 .inner 元素，因为当他们尝试点击时，他们实际最终点击的是 .inner 中的子对象对象。因此，您不会获得该类(class)的目标。
您有几个选择。首先，如果您的 HTML 不是使用 JS 代码动态创建的，那么您可以直接将事件监听器应用于所有 .inner 对象，正常的点击事件传播将导致它们在子节点时触发被点击。
或者，如果您想将事件处理程序保留在主体上，那么解决方法可能是查看父链是否包含该类(您的目标将低于 .inner 几个级别).
function hasClass(elem, cls) {
var str = " " + elem.className + " ";
var testCls = " " + cls + " ";
return(str.indexOf(testCls) != -1) ;
}
function isTargetInClass(target, cls) {
while (target && target !== document.body) {
if (hasClass(target, cls)) {
return true;
}
target = target.parentNode;
}
return false;
}
function theHandler(e){
e = e || window.event;
var target = e.target || e.srcElement;
if (isTargetInClass(target, "inner")) {
//console.log("inner class was clicked");
alert("inner class was clicked");
}
}
关于javascript - 为一个类添加了事件监听器，该类的一些成员不受影响，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/22773195/
24
4
0
当单击复选框(或选择所有复选框)时，我想向 CheckboxSelectionModel 添加一个监听器。 var smSensors = new xg.CheckboxSelectionModel(
我有一个简单的程序，允许 2 个客户端连接到服务器。 连接后，他们可以轮流点击空白卡片图像。 一旦 2 个客户中的任何一个点击空白卡片图片，卡片图片将变为 Ace 俱乐部图片。 更改将显示在客户端的两
我在这里看到了一个代码，该代码以字符串的形式检索鼠标的当前图标，但是此代码使用了TTimer来实现。 因此，我想知道是否存在某些事件（侦听器）来检测鼠标光标图标上的这些更改。 下面是使用TTimer的
我想在我的配置对象上获得一个 onload 事件。 以下工作，除非我创建一个 config.listeners={..} (我认为这就是我需要的？)替换 this.onload({...}); 我什至
通常，在 Java 中，当我有一个向其他对象提供某种通知的对象时，我将使用 Listener/Observer 模式。 有没有更类似于 Scala 的方式来做到这一点？我应该在 Scala 中使用这种
我有一个带有动画器的游戏对象和一些可以触发事件的动画(具有特定的回调函数)。 只要我将脚本添加到与动画器相同的游戏对象(包括接收器)，一切都会正常工作: public class AnimatorEv
我有一个带有监听器的 DialogFragment，用于单击按钮以调用 fragment 中的函数。 我收到 lateinit property listener has not been initi
这个问题已经有答案了: Java ActionListener error: incompatible types (4 个回答) 已关闭 5 年前。 我最近刚刚开始学习 Java 代码。我在添加监听
我的代码遇到问题。我想知道是否有一种更简单的方法来使用监听器，而不是不断地这样做: example.addActionListener(new java.awt.event.ActionListene
有没有办法使用 .net 创建控制台应用程序。或通过某个端口监听 SMTP 消息的服务？ 我需要创建一个中间层对象来捕获和处理 smtp 消息。也就是说，我希望该监听器发送和接收 smtp 消息，然后
我有一个带有动画器的游戏对象和一些可以触发事件的动画(具有特定的回调函数)。 只要我将脚本添加到与动画器相同的游戏对象(包括接收器)，一切都会正常工作: public class AnimatorEv
我有许多向主事件生成服务注册的监听器。然而，我想告诉听众，事件流在某个时刻将会结束。您会通过简单地调用监听器上的方法(例如 finish())来完成此操作，还是有一个单独的事件方法 streamFin
我的代码有什么问题。 我创建了一个 JList，添加了项目并将其推到左侧(BorderLayout.WEST)。每次单击列表项时，我希望在列表右侧显示一个面板。但问题是，当选择列表项并运行监听器时，到
关闭。此题需要details or clarity 。目前不接受答案。 想要改进这个问题吗？通过 editing this post 添加详细信息并澄清问题. 已关闭 8 年前。 Improve th
这可能是一个简单的问题，但我没有看到它。 我有一个界面 public interface RenderableListener{ public void update(T element);
有人可以直接指出我的正确方向吗？当从组合框中选择适当的选项时，我希望小程序中的 Action 监听器显示从 html 文件检索的 jlabel 中的 3 个参数之一。 干杯 最佳答案 对于组合框，您需
我有一个网站，每个页面上都有许多 jQuery 事件处理程序，所有这些都在一个大型 .js 文件中。 这意味着对于任何页面，大多数事件处理程序都是针对不存在且根本不会使用的 HTML。 这会影响我的表
我有一些 jQuery 监听器设置，用于监听 type="text" 字段上的表单输入。但是，当用户从自动完成下拉框中选择一个选项(即他们之前输入的值已被记住以供将来使用)时，下面的监听器不会收集该值
关闭。这个问题需要多问focused 。目前不接受答案。 想要改进此问题吗？更新问题，使其仅关注一个问题 editing this post . 已关闭 9 年前。 Improve this ques
我正在用 unity (c#) 做一个类似国际象棋的游戏，但我在尝试进行向上转换以将信息从一个 child 发送到另一个抽象类时遇到了困难。 基本上，我有一个抽象类，它有一个带有函数的事件/委托(de
我是一名优秀的程序员,十分优秀！