Html 通过单击带有特定类的框来获取值或ID

下面是带有laravel foreach循环的HTML代码

                @foreach($tables as $t)
                @if($t->section_id == $s->section_id)
                <div class="col-xl-3 bg-success px-6 py-8 rounded-xl mr-7 mb-7 my-button">                    
                <div class="text-inverse-succeess font-weight-bolder font-size-h2 mt-3 table" id="{{ $t['table_number']}}"><h2>{{ $t['table_number']}}</h2></div>
                <a href="#" class="text-inverse-success font-weight-bold font-size-lg mt-1">New Products</a>
                </div>  
                @endif
                @endforeach

---

我如何实现这一点，以便在单击框时获得表号？

您可以执行以下操作：

$('.my-button').click(function() {
  var table = "h2 value: " +$('.table h2', this).text();
  var tableid = "table id: " + $('.table', this).attr("id");
  console.log(table);
  console.log(tableid)
});

演示

$（'.my按钮'）。单击（函数（）{
var table=“h2值：”+$（'.table h2'，this）.text（）；
var tableid=“table id:”+$（'.table'，this.attr（“id”）；
控制台日志（表）；
console.log（tableid）
});

1.
2.
您可以这样做：

$('.my-button').click(function() {
  var table = "h2 value: " +$('.table h2', this).text();
  var tableid = "table id: " + $('.table', this).attr("id");
  console.log(table);
  console.log(tableid)
});

演示


$（'.my按钮'）。单击（函数（）{
var table=“h2值：”+$（'.table h2'，this）.text（）；
var tableid=“table id:”+$（'.table'，this.attr（“id”）；
控制台日志（表）；
console.log（tableid）
});

1.
2.