gpt4 book ai didi

jquery - 如何使用 jQuery 选择 anchor 标记内的文本

转载 作者:太空宇宙 更新时间:2023-11-04 14:21:20 27 4
gpt4 key购买 nike

我想选择 a 标签并在点击时显示它的文本。

换句话说,当我点击第一个链接 - “One”时,我想使用 alert 显示它的文本“One”。

当我单击第二个链接 - “Example”时,我想使用 alert 显示文本“Example”。

<body>
<div id="tree">
<ul>
<li><a target="_blank" href="one.html">One</a></li>
<li class="folder expnded"><a target="_blank" href="two.html">Examples</a></li>
</ul>
</div>
<div id="display"></div>
</body>

更新 1:

谢谢大家的回答。我真正想做的是我需要创建一个树结构,当我单击树叶节点时,我必须显示该叶节点的名称。

我使用 jQuery DynaTree 创建了树结构,但 jQuery 选择器在上面的代码中对我不起作用。

我无法选择标签或 div 标签内的任何其他元素。

下面是树结构:

enter image description here

这是我的完整 HTML 代码(以上只是示例代码)

<html>
<head>
<!-- Include the required JavaScript libraries: -->
<script src="js/jquery-1.7.1.min.js" type="text/javascript"></script>
<script src='js/jquery-ui-1.8.20.custom.min.js' type="text/javascript"></script>
<script src='js/myjquery.js' type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="css/ui.dynatree.css">
<link rel="stylesheet" type="text/css" href="css/style.css">
<script src="js/jquery.dynatree.js" type="text/javascript"></script>

</head>

<body>
<div id="tree">
<ul>
<li>one</li>
<li><a target="_blank" href="">Google</a>
<li class="folder expnded">Examples
<ul>
<li><a target="content" href="" id="s">one</a>
<li><a target="content" href="two.html">two</a>
<li class="folder">Folder one
<ul>
<li><a target="content" href="one.html">one</a>
<li><a target="content" href="two.html">two</a>
</ul>
<li><a target="content" href="three.html">three</a>
<li><a target="content" href="four.html">four</a>
<li class="folder">Folder two
<ul>
<li><a target="content" href="one.html">one</a>
<li><a target="content" href="two.html">two</a>
</ul>
<li class="folder">Folder three
<ul>
<li><a target="content" href="one.html">one</a>
<li><a target="content" href="two.html">two</a>
<li class="folder">Inner Folder
<ul>
<li><a target="content" href="one.html">one</a>
<li><a target="content" href="two.html">two</a>
</ul>
</ul>
</ul>
</ul>
</div>

<div id="display">
<a href="" id="s">one</a>
</div>

</body>
</html>

我发布的图片是上面HTML代码的输出。

在 myjquery.js 文件中我有这样的代码(旧的)

$(function() {
// --- Initialize sample trees
$("#tree").dynatree({
autoFocus : true,
// persist: true,
minExpandLevel : 2,
onFocus : function(node) {
// Auto-activate focused node after 1 second
if (node.data.href) {
node.scheduleAction("activate", 1000);
}
},
onBlur : function(node) {
node.scheduleAction("cancel");
},
onActivate : function(node) {
if (node.data.href) {
window.open(node.data.href, node.data.target);
}
}
});
});

更新 2:

我的问题的解决方案

在 myjquery.js 文件中,以下新代码适用于我。您可以将其与上面的旧代码进行比较。

$(function() {
// --- Initialize sample trees
$("#tree").dynatree({
autoFocus : true,
persist: true,
minExpandLevel : 1,
onFocus : function(node) {
// Auto-activate focused node after 1 second
if (node.data.href) {
node.scheduleAction("activate", 1000);
}
},
onBlur : function(node) {
node.scheduleAction("cancel");
},
onActivate : function(node) {
if (node.data.href) {
window.open(node.data.href, node.data.target);
}
},
onClick : function(node) {
$.ajax({
type : "GET",
url : "Display",
data : {
id : node.data.title
},
success : function(data) {
$("#display").html(data);
}
});
}
});
});

最佳答案

$('a', '#tree li').on('click', function(e) {
e.preventDefault(); // this line is for prevent page reload
alert($(this).text());
});

DEMO

阅读更多关于 .text() 的信息和 jQuery selectors

根据编辑

你可以像下面这样尝试:

$('span[class^=dynatree-exp-c] a').on('click', function(e) {
e.preventDefault();
alert( $(this).text() );
});

dynatree 的每个叶节点都是具有 dynatree-exp-cdynatree-exp-c1 等类的跨度,所以我使用 [class^ =dynatree-exp-c] 选择类以 dynatree-exp-c 开头的跨度。

关于jquery - 如何使用 jQuery 选择 anchor 标记内的文本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10918784/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com