个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
24
4
我想将我的标记与行为分开，但我坚持如何将我创建的函数与 onclick 事件后文档中的所有链接关联起来，而不是将其直接包含在标记中。这是我的 HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Image Gallery</title>
</head>
<body>
<h1>Snapshots</h1>
<ul>
<li>
<a href="images/fireworks.jpg" title="A fireworks display" onclick="showPic(this); return false;">Fireworks</a>
</li>
<li>
<a href="images/coffee.jpg" title="A cup of black coffee" onclick="showPic(this); return false;">Coffee</a>
</li>
<li>
<a href="images/rose.jpg" title="A red, red rose" onclick="showPic(this); return false;">Rose</a>
</li>
<li>
<a href="images/bigben.jpg" title="The famous clock" onclick="showPic(this); return false;">Big Ben</a>
</li>
</ul>
<img id="placeholder" src="images/placeholder.gif" alt="my image gallery">
<script type="text/javascript" src="scripts/showPic.js"></script>
</body>
</html>
这是我的脚本
function showPic(whichPic) {
"use strict";
var source = whichPic.getAttribute("href");
var placeholder = document.getElementById("placeholder");
placeholder.setAttribute("src", source);
}
window.onload = function() {
"use strict";
var anchors = document.getElementsByTagName("a");
console.log(anchors);
for(var i = 0, count = anchors.length; i < count; i++) {
//anchors[i].preventDefault;
// anchors[i].onclick = showPic;
}
}
我尝试循环链接并将该函数分配给每个链接的 onclick 事件，但它不起作用。为了使行为与标记完全分离，最好的方法是什么？
最佳答案
function showPic(e) {
// e is the event, e.target is the current element
"use strict";
e.preventDefault();
var source = e.target.getAttribute("href");
var placeholder = document.getElementById("placeholder");
placeholder.setAttribute("src", source);
}
window.onload = function() {
"use strict";
var anchors = document.getElementsByTagName("a");
for(var i = 0, count = anchors.length; i < count; i++) {
anchors[i].onclick = showPic;
// Or you could use anchors[i].addEventListener('click',showPic);
}
}
不要忘记删除 HTML 中的内容。
附注
Void提到使用 addEventListener 而不是 onclick。两者都是可以接受的，但要记住区别:
这段代码:
element.onclick = func1;
element.onclick = func2;
将导致在点击时调用 func2，但不会调用 func1。这是因为它会覆盖该精确元素上任何先前的 .onclick 语句。
但是这段代码:
element.addEventListener('click',func1);
element.addEventListener('click',func2);
将导致 func1 和 func2 都被执行，因为它们相加。
关于javascript - 在 onclick 事件之后为每个链接分配一个函数，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/28568293/
24
4
0
我有一个应用程序，它会抛出 GKSession 并在各种条件下(连接超时、 session 失败等)创建一个新的 GKSession。不过，我遇到了内存泄漏问题，并且有时会在重新连接几次循环后崩溃。
比如我在宿主代码中有一个浮点指针 float *p 是否可以确定他指向的内存类型(设备/主机)？ 最佳答案 在 UVA system 中, 运行时 API 函数 cudaPointerGetAttri
我已将项目转换为 .Net 4.0 并且以下代码不起作用: typeof(RuntimeTypeHandle).GetMethod("Allocate", BindingFlags.Instance
当我声明 char ch = 'ab' 时，ch 只包含 'b'，为什么它不存储 'a'？ #include int main() { char ch = 'ab'; printf("%c"
我对 Disk Sector 和 Block 有疑问。扇区是一个单位，通常为 512 字节或 1k、2k、4k 等取决于硬件。文件系统 block 大小是一组扇区大小。 假设我正在存储一个 5KB 的
假设我有 8 个人和5000 个苹果。 我想将所有苹果分发给所有 8 个人，这样我就没有苹果了。 但每个人都应该得到不同数量 将它们全部分发出去的最佳方式是什么？ 我是这样开始的: let peopl
我正在构建的网站顶部有一个搜索栏。与 Trello 或 Gmail 类似，我希望当用户按下“/”键时，他们的焦点就会转到该搜索框。 我的 JavaScript 看起来像这样: document.onk
我有一小段代码: if (PZ_APP.dom.isAnyDomElement($textInputs)){ $textInputs.on("focus", function(){
我观察到以下行为。 接受了两个属性变量。 @property (nonatomic, retain) NSString *stringOne; @property (nonatomic, assign
我正在解决这样的问题 - 实现一个计算由以下内容组成的表达式的函数以下操作数:“(”、“)”、“+”、“-”、“*”、“/”。中的每个数字表达式可能很大(与由字符串表示的一样大)1000 位)。 “/
我有一组主机和一组任务。 每个主机都有 cpu、mem 和任务容量，每个任务都有 cpu、mem 要求。 每个主机都属于一个延迟类别，并且可以与具有特定延迟值的其他主机通信。 每个任务可能需要以等于或
该程序的作用:从文件中读取一个包含 nrRows 行和 nrColomns 列的矩阵(二维数组)。矩阵的所有元素都是 [0,100) 之间的整数。程序必须重新排列矩阵内的所有元素，使每个元素等于其所在
世界!我有个问题。今天我尝试创建一个代码，它可以找到加泰罗尼亚语号码。但是在我的程序中可以是长数字。我找到了分子和分母。但我不能分割长数字!此外，只有标准库必须在此程序中使用。请帮帮我。这是我的代码
我确定我遗漏了一些明显的东西，但我想在 Objective C 中创建一个 NSInteger 指针的实例。 -(NSInteger*) getIntegerPointer{ NSInteger
这个问题在这里已经有了答案: Difference between self.ivar and ivar? (4 个答案) 关闭 9 年前。
我如何将 v[i] 分配给一系列整数(v 的类型是 vector )而无需最初填充 最佳答案 你的意思是将 std::vector 初始化为一系列整数？ int i[] = {1, 2, 3, 4,
我想寻求分配方面的帮助....我把这个作业带到了学校......我必须编写程序来加载一个 G 矩阵和第二个 G 矩阵，并搜索第二个 G 矩阵以获取存在数第一个 G 矩阵的......但是，当我尝试运行
我必须管理资源。它基本上是一个唯一的编号，用于标识交换机中的第 2 层连接。可以有 16k 个这样的连接，因此每次用户希望配置连接时，他/她都需要分配一个唯一索引。同样，当用户希望删除连接时，资源(号
是否有任何通用的命名约定来区分已分配和未分配的字符串？我正在寻找的是希望类似于 us/s 来自 Making Wrong Code Look Wrong ，但我宁愿使用常见的东西也不愿自己动手。 最佳
我需要读取一个 .txt 文件并将文件中的每个单词分配到一个结构中，该结构从结构 vector 指向。我将在下面更好地解释。 感谢您的帮助。 我的程序只分配文件的第一个字... 我知道问题出在函数 i
我是一名优秀的程序员,十分优秀！