2

我如何知道我使用 jQuery 单击了哪种类型的 HTML 对象?

例如,如果我单击按钮,那么它应该告诉我这是按钮对象或文本输入或文本区域......就像那样。

为什么我问这个问题?

因为我面临着这种类型的一个问题。

我有一个 Textarea,就在下面我有文件输入 HTML 对象。我已将 Caret 函数(返回 Textarea 中的当前光标位置)绑定到该 Textarea。但是当我点击浏览按钮上传文件时,它给了我一个错误。所以我想通过知道哪种类型的 HTML 对象来防止这种情况发生?

4

7 回答 7

2

你可以这样做

$(".myBtn").click(function(){

       alert($(this).prop("tagName"));

});

更新

这是一个演示小提琴

于 2013-09-28T04:25:43.983 回答
1

在点击事件中

function(e){
    var type=$(this).prop('tagName'); // I think it will need jQuery >1.6
    // or
    var type=$(this)[0].tagName;
}

实际上,过去有很多关于这个问题的帖子。

于 2013-09-28T04:24:24.133 回答
1

好吧,您可以使用 attr("tagName") 它将返回标签的名称。

示例代码片段:假设您单击某个 id 为 #myId 的元素,然后绑定单击事件并获取 attr("tagName") (jQuery方式)

$('#myId').on('click', function(){
  console.log($(this).attr('tagName'));
});

这应该会有所帮助。

于 2013-09-28T04:51:38.800 回答
0

演示

$(this).attr("tagName")

或者可以使用

 $(this).prop('tagName');

参考attrprop

于 2013-09-28T04:28:18.653 回答
0

您还可以使用一些 DOM 属性来获取对象类型:

e.target.nodeName

或者

e.target.tagName

例如:

HTML -

<input class="Track" type="button" value="Submit" />
 <button class="Track">Submit</button>

jQuery -

$('.Track').click(function (e) {
   alert("Object: " + e.target.nodeName + " Type: " + e.target.type);            
});

尝试这个

于 2013-09-28T05:16:06.947 回答
0

$(e.target) - 包含用户点击的 DOM 元素。我们可以使用此对象来获取有关用户单击的对象的任何内容。

e.target 始终是被点击的顶部元素。因此,虽然屏幕上的每次点击在技术上都是点击主体,但 e.target 将始终返回树中占据点击区域的最远的子元素。但是,我们可能有多个绝对定位的元素占据同一区域。在这种情况下,将返回具有较高 z-index 的元素。

于 2013-09-28T04:43:50.810 回答
0
<!doctype html>
<html lang="en">
<head>
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>
<body> 
<div id="log"></div>
<input type="button" id="myButton" value="Button">
<input type="submit" id="myButton" value="submit">
<input type="text" id="myButton" value="text">
<input type="date" id="myButton" value="date">
<textarea>Test</textarea>
<script>
$("input, textarea").on('click', function (e) {
    $( "#log" ).html( "clicked: " + event.target.nodeName + " Type: " + this.type);
});
</script>
</body>
</html>
于 2013-09-28T04:39:48.053 回答