jquery - 获取table整行信息,不用onclick传值

mac2022-06-30  118

在项目里有一个编辑按钮,点击弹出弹窗,需要获取很多值,之前直接穿一个json,但是会有bug,因为json里有的需要转义

解决 :通过$(this)获取tr,再依次获取需要的td的值

//html <tr data-id="{{$item->id}}" data-category="{{$item->category}}"> <td class="vertical-middle">{{$item->name_zh_cn}}</td> <td class="vertical-middle">{{$item->name_en}}</td> <td class="vertical-middle">{{$item->name_ko}}</td> <td class="vertical-middle">{{$item->des_zh_cn}}</td> <td class="vertical-middle">{{$item->des_en}}</td> <td class="vertical-middle">{{$item->des_ko}}</td> <td class="vertical-middle type" data-value="{{$item->type}}"> $item->type </td> <td class="vertical-middle"> <img src="{{asset($item->cover_name)}}" style="max-height: 80px;max-width:80px; " onclick="fullImage('{{asset($item->cover_name)}}')"> </td> <td class="vertical-middle"> @if($item->url=='') 暂无页面 @else <a target="_blank" href="{{route($item->url)}}">{{$item->url}}</a> @endif </td> <td class="vertical-middle">{{$item->sort}}</td> <td class="vertical-middle"> <button class="btn btn-primary edit-item">修改</button> <button class="btn btn-danger delete-item">删除</button> </td> </tr> //js $(document).ready(function () { //编辑产品 $('.edit-item').click(function () { //清空列表 $('#editForm .form-control').val(""); var tr = $(this).parents('tr'); var name_zh_cn = tr.children('td').eq(0).text(); var name_en = tr.children('td').eq(1).text(); var name_ko = tr.children('td').eq(2).text(); var des_zh_cn = tr.children('td').eq(3).text(); var des_en = tr.children('td').eq(4).text(); var des_ko = tr.children('td').eq(5).text(); var imgurl = tr.children('td').eq(-4).children('img').attr('src'); var sort = tr.children('td').eq(-2).text(); var id = tr.data('id'); var category = tr.data('category'); var type = tr.children('td').eq(-5).data('value'); $('#editForm #name_zh_cn').val(name_zh_cn); $('#editForm #name_en').val(name_en); $('#editForm #name_ko').val(name_ko); $('#editForm #des_zh_cn').val(des_zh_cn); $('#editForm #des_en').val(des_en); $('#editForm #des_ko').val(des_ko); $('#editForm #sort').val(sort); $('#editForm img').attr('src', imgurl); $('#editForm #id').val(id); $('#editForm #category').val(category); $('#editForm select[name="type"]').val(type); }); });

转载于:https://www.cnblogs.com/gggggggxin/p/11434561.html

最新回复(0)