gpt4 book ai didi

javascript - jquery或js代码获取网页中当前选定的表单项/文本/图像的精确节点数据

转载 作者:行者123 更新时间:2023-11-28 21:01:35 25 4
gpt4 key购买 nike

我想使用 jquery 获取已点击的网页上的项目的确切详细信息。

该项目可以是表单项目(如复选框、文本框、文本区域等)或文本部分(在段落或 div 或其他中)或列表或图像...

我的结论如下——

$(function(){
$('*')
.bind('click', function(event) {
//now obtain details of item that has been clicked on...

});
});

现在,我想要确切的详细信息 - 即 div id/form id/paragraph #,即该特定项目的所有详细信息。我如何获取这些数据?我知道这些数据在 DOM 中可用,但我只是不知道在这种特殊情况下如何获取它......

最佳答案

可能是使用 target 的最佳方法事件的属性。默认情况下,这会返回一个非 jQuery 对象,这不是特别有用,但是将其包装在 $() 中。解决了这个问题:

$(function() {
$(document).bind('click', function(event) {
var element = $(event.target);

alert(element.height()); // Get height
alert(element.attr('id')); // Get ID attribute
// ...
});
});
<小时/>

如果您想修复当前的方法,请在 click() 内处理程序,您可以使用 .attr() 访问该元素的属性和 friend 们:

$(function() {
$('*').bind('click', function(event) {
alert($(this).height()); // Get height
alert($(this).attr('id')); // Get ID attribute
// ...
});
});

$(this)函数范围内引用被单击的元素。有一个将返回属性 here 的函数列表和 here在 jQuery 文档中。 $.attr('id') 将返回元素的 ID 等,以及 $.data()将返回data-*属性。

要获取父元素的属性,只需使用 $(this).parent() 。例如,要获取包含单击元素的表单的 ID,请使用 $(this).closest('form').attr('id'); 。一切都与单击的元素( $(this) )相关,因此您可以只使用 DOM traversal functions .

但是,使用$('*').bind()效率低得令人难以置信;您将事件处理程序绑定(bind)到页面上的每个元素,而实际上您应该使用 .on() 委托(delegate)事件(jQuery 1.7+):

$(function() {
$('body').on('click', '*', function(event) {
alert($(this).height()); // Get height
alert($(this).attr('id')); // Get ID attribute
// ...
});
});

此方法仅将一个事件绑定(bind)到 <body>而不是页面上每个元素的事件。

关于javascript - jquery或js代码获取网页中当前选定的表单项/文本/图像的精确节点数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10865948/

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