我正在尝试使用jQuery获取单击其href元素的容器的ID。我知道这涉及使用parent()方法,但是我不确定如何将它们放在一起。
这是我将要处理的HTML文档的摘要:
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
</head>
<body>
<div id="cntnr_1" class="container">
<a href="/foo1">foo1</a>
<a href="/foo2">foo2</a>
<a href="/foo3">foo3</a>
</div>
<div id="cntnr_2" class="container">
<a href="/foobar1">foobar1</a>
<a href="/foobar2">foobar2</a>
<a href="/foobar3">foobar3</a>
</div>
<script type="text/javascript">
$().ready(function(){
//display the url of the clicked on link
//display the id of the container whose href was clicked on
});
</script>
</body>
</html>
所需的行为(当单击“容器”中的链接[href]时)如下:
显示单击的URL的链接(以便我可以向该URL提交AJAX POST)
显示容器的ID(以便我可以将接收到的数据推回该ID)
谁能帮助您获取父容器ID和被点击的网址?
[[编辑]]
我已经在这里发布了我正在使用的实际HTML代码:http://jsfiddle.net/fpPRL/
最佳答案
$('.container a').click(function(e){
e.preventDefault();
var url = $(this).attr('href');
var container_id = $(this).parent().attr('id');
alert('the url is "'+ url +'" from the container #' + id);
});
更新:
由于您是在其他html标记上尝试过的(并且无法正常工作),因此这里提供了一种更通用的解决方案(请在此处查看实际操作:http://jsfiddle.net/fpPRL/1/):
$('.container a').click(function(e){
e.preventDefault();
var url = $(this).attr('href');
var container_id = $(this).parents('.page_container:first').attr('id');
alert('the url is "'+ url +'" from the container #' + id);
});