Question

我有以下代码，我正在尝试确定a元素的id：

<li>
 <a class="selectTour" id="32">
   <span>Bla</span>

   <div class="margin-top-2"><font style="white-space:normal; font-size: small">Test 22</font></div>

   <p class="ui-li-aside"><strong>Created</strong>
 </a>
</li>

由于使用了数据框架（backbone.js），我无法使用href元素进行路由。我试图在selectTour类上绑定一个函数然后我试图通过事件监听器获取id（顺便说一下selecTour出现n次）：

selectTour:function(event) {
            $.mobile.loading("show");
            var tour_id = event.target.id;

            this.router.navigate("tour/" + tour_id, {trigger: true})
        },

问题是当用户点击（例如）字体元素（或除a元素之外的其他元素）时，返回错误的id。在我看来，这是一个标准的javascript / jquery问题，但我无法弄明白，需要向正确的方向努力。

Answer 1

您可以使用.closest()查找点击目标中距离最近的selectTour元素，然后使用.attr()获取其ID。

selectTour: function (event) {
    $.mobile.loading("show");
    var tour_id = $(event.target).closest('.selectTour').attr('id');

    this.router.navigate("tour/" + tour_id, {
        trigger: true
    })
},

如果点击处理程序定位到e.currentTarget.id元素，您甚至可以尝试selectTour。

Answer 2

我认为你应该这样改变你的脚本：

var tour_id = ($(event.target)[0].id.length) ? $(event.target)[0].id : $(event.target).closest('a.selectTour')[0].id;

因为你的event.target元素并不总是selectTour所以它不会得到它的id，所以你可以使用jQuery来检查id长度，如果可用则分配如果event.target不是selectTour，则转到selectTour并.closest()获取并将ID分配给var tour_id。< / p>

使用jQuery的.attr()：

var tour_id = ($(event.target).attr('id').length) ? $(event.target).attr('id') : $(event.target).closest('a.selectTour').attr('id');

Answer 3

这件事给了我32我认为是正确的

$('.selectTour').bind('click',function(e){
  alert($(this).attr('id'));
});

如何获取周围元素的id？

3 个答案: