如何从jquery中的事件中获取HTML元素?

时间:2011-10-09 08:16:46

标签: javascript jquery events

在jQuery函数中,我在表单元素点击事件上获取事件。现在我想得到它的HTML。怎么可能?

例如:

function(event, ID, fileObj, response, data) {
    alert( $(event.target) );            // output: [object Object]
    alert( event.target );               // output: [object HTMLInputElement]
    alert( $(event.target).html() );     // output: (nothing)    
}

我希望获得通过event

点击元素的表单对象

由于

3 个答案:

答案 0 :(得分:9)

您可以尝试event.target.outerHTML,但我不确定它在所有浏览器中的支持程度如何。一个更复杂但肯定工作的解决方案是将元素包装在另一个元素中,然后获取父元素的html:

$('<div/>').html($(event.target).clone()).html();

答案 1 :(得分:3)

如果您的事件是click,则可以使用jQuery中的click()方法绑定它。使用this来覆盖您的元素,如下面的代码:

$('#id').click(function(event){
  console.log($(this));
});

答案 2 :(得分:1)

我发现最优雅的解决方案是简单地使用事件目标上的属性。 以下是如何检测事件源html标记的示例。 此示例假定您已使用CSS类名 myUnorderedList 绑定了无序列表的列表项单击事件,但是如果在列表项中单击了锚标记,则要禁用默认操作

$('ul.myUnorderedList').on('click', 'li', function(event){ 

    console.log('tagName: '+ event.target.tagName);    //output: "a"
    console.log('localName: '+ event.target.localName);//output: "a"
    console.log('nodeName: '+ event.target.nodeName);  //output: "A"

    if(event.target.tagName == 'a')
        return; // don't do anything...

    // your code if hyperlink is not clicked
});