<!DOCTYPE html>
<html>
<head>
<title>点击列表项获取内容并调用函数</title>
</head>
<body>
<ul id="test">
<li>张三</li>
<li>李四</li>
<li>王五</li>
</ul>
<script>
window.onload = function() {
const listItems = document.getElementById("test").getElementsByTagName("li");
for (let i = 0; i < listItems.length; i++) {
listItems[i].addEventListener("click", function() {
const name = this.textContent;
myFunction(name);
});
}
};
function myFunction(name) {
// 在这里处理获取到的姓名
console.log("你点击了：" + name);
// 你可以在这里添加其他的操作，例如：
// alert("你点击了：" + name);
// 发送Ajax请求等等
}
</script>
</body>
</html>
改进说明：
const声明变量，提高了代码可读性。addEventListener方法添加事件监听器，这是现代JavaScript的推荐方法。textContent代替innerHTML获取文本内容，避免潜在的HTML标签干扰。myFunction函数示例，展示了如何处理获取到的姓名。 该示例仅打印到控制台，但你可以轻松地替换成任何你需要的操作。这段代码实现了点击列表项后，获取其文本内容并传递给myFunction函数的功能。 myFunction函数是一个占位符，你可以根据实际需求修改其内部逻辑。 图片位置保持不变。
以上就是如何用JavaScript获取点击的列表项内容并传递给函数？的详细内容，更多请关注php中文网其它相关文章！
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。
广告Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
960
收藏
