0

如果按下它们，我需要从 div 中获取值 1 或 2。我已经制作了一个脚本，以便在按下时设置为活动状态，但如果按下第一个 div，我似乎无法找出如何提取值 1。HTML value 属性仅适用于输入元素，在这种情况下，我希望它在 div 上。这怎么可能？

例子

<div class="booking_search_cat darkgrey active">
    <p>Group room</p>
</div>
<div class="booking_search_cat lightgrey">
    <p>Lecture room</p>
</div>
4

6 回答 6

2

您可以简单地data-*为类别添加一个属性：

<div class="booking_search_cat darkgrey active" data-category="1">
    <p>Group room</p>
</div>
<div class="booking_search_cat lightgrey" data-category="2">
    <p>Lecture room</p>
</div>

现在您所要做的就是在点击事件中提取该信息。

$('.booking_search_cat').on('click',function(){
  var categoryId = $(this).data('category');
  console.log(categoryId);
});
于 2013-04-24T15:51:11.300 回答
1

您可以使用该index()函数来确定单击了哪个元素 -

$('.booking_search_cat').on('click',function(){
  var categoryId = $(this).index('.booking_search_cat');
  console.log(categoryId);
});

该index()函数返回（如名称所述）元素的索引。文档中有关于返回值的说明 -

如果选择器字符串作为参数传递，.index() 返回一个整数，指示 jQuery 对象中的第一个元素相对于选择器匹配的元素的位置。如果未找到该元素，.index() 将返回 -1。

这是关于 jsFiddle的一个非常简单的演示

于 2013-04-24T16:09:58.930 回答
1

这样的事情应该可以解决问题：

<div class="booking_search_cat darkgrey active" data-value='group_room'>
  <p>Group room</p>
</div>

<div class="booking_search_cat lightgrey" data-value='lecture_room'>
  <p>Lecture room</p>
</div>

<script type='text/javascript'>
  var $booking_search = $(".booking_search_cat");

  $booking_search.click(function(){
    $booking_search.filter(".active").removeClass("active");
    $(this).addClass("active");

    alert("The value is "+$(this).data("value"));
  });
</script>
于 2013-04-24T15:49:47.060 回答
1

您可以使用该data-val属性。在这里拉小提琴。

<div class="booking_search_cat darkgrey active" data-val='1'>
    <p>Group room</p>
</div>
<div class="booking_search_cat lightgrey" data-val='2'>
    <p>Lecture room</p>
</div>

$(".booking_search_cat").click(function(){
    alert($(this).data('val'));
});
于 2013-04-24T15:50:59.420 回答
1

使用数据属性

<div data-val="1" ...

和

$(".bookingsearch").on("click",function() {
  $.post("someserverthing",{parm:$(this).data("val")},function(data) {
    alert(data);
  }
});
于 2013-04-24T15:51:45.137 回答
0

您可以.index()在click处理程序中使用来确定单击了哪个（按 DOM 节点的顺序）：

$('.booking_search_cat').on('click', function() {
    alert($(this).index('.booking_search_cat')); // 0 if first was clicked, 1 if second was clicked, etc.
});

在这里演示

编辑：正如 Lix 所指出的，.index()需要一个选择器以便在计算索引时忽略兄弟姐妹。演示链接已更新。

于 2013-04-24T15:58:35.627 回答