var id = $(this).parent().attr("data-id");代码中data-id指的是<div class="xzCzIn"> <a href="javascript:void(0)" class="Dels" :data-id="c.id">删除</a> </div>中的data-id还是c.id,需要把var id = $(this).parent().attr("data-id");中的data-id换成c.id吗

是的，需要将`var id = $(this).parent().attr("data-id");`中的`data-id`替换为`c.id`，即`var id = $(this).parent().attr("c.id");`。因为在HTML代码中，`data-id`是Vue.js的动态绑定方式，而在JavaScript代码中，需要直接获取`c.id`的值。

相关问题

$(this).children()输出的属性是什么

`$(this).children()` 是 jQuery 中的一个方法，用于获取当前元素的所有子元素。该方法返回一个 jQuery 对象，其中包含了所有子元素的元素对象。

如果要获取子元素的属性值，可以使用 jQuery 对象提供的一些方法，例如 `attr()`、`prop()`、`data()` 等。这些方法可以传入一个属性名称作为参数，返回对应属性的值。

以下是一个示例代码，演示如何获取子元素的属性值：

// HTML 代码
<div id="parent">
  <div class="child" data-value="123">子元素1</div>
  <div class="child" data-value="456">子元素2</div>
</div>

// JavaScript 代码
$("#parent").children().each(function() {
  var value = $(this).data("value"); // 获取 data-value 属性值
  console.log(value); // 输出：123 和 456
});

在这个示例代码中，`$(this)` 代表了当前元素，即 `#parent` 元素的一个子元素。`$(this).children()` 返回了 `#parent` 元素的所有子元素，然后使用 `each()` 方法遍历这些子元素，分别获取它们的 `data-value` 属性值。

springboot整合mybatis-plus的分页查询详细的html和js代码

以下是一个使用Spring Boot和MyBatis-Plus进行分页查询的简单示例，包括前端HTML和JS代码。

在后端，我们需要定义一个Controller来接收前端的分页请求并返回分页结果。这里使用了MyBatis-Plus提供的Page类来实现分页查询。在前端，我们使用jQuery和Bootstrap来实现分页功能。

后端代码：

@RestController
@RequestMapping("/users")
public class UserController {

    @Autowired
    private UserService userService;

    @GetMapping("/list")
    public Page<User> listUsers(@RequestParam(defaultValue = "1") int page,
                                @RequestParam(defaultValue = "10") int size) {
        Page<User> users = userService.listUsers(page, size);
        return users;
    }
}

UserService中的listUsers方法调用了MyBatis-Plus提供的PageHelper类进行分页查询：

@Service
public class UserService {

    @Autowired
    private UserMapper userMapper;

    public Page<User> listUsers(int page, int size) {
        Page<User> pager = new Page<>(page, size);
        QueryWrapper<User> wrapper = new QueryWrapper<>();
        return userMapper.selectPage(pager, wrapper);
    }
}

前端代码：

<div class="container">
    <h1>User List</h1>
    <table class="table table-striped">
        <thead>
            <tr>
                <th>ID</th>
                <th>Name</th>
                <th>Email</th>
            </tr>
        </thead>
        <tbody id="user-list">
        </tbody>
    </table>
    <ul class="pagination">
        <li class="page-item" id="prev-page">
            <a class="page-link" href="#">Previous</a>
        </li>
        <li class="page-item active" id="page-1">
            <a class="page-link" href="#">1</a>
        </li>
        <li class="page-item" id="next-page">
            <a class="page-link" href="#">Next</a>
        </li>
    </ul>
</div>

$(function () {
    var currentPage = 1;

    function loadUsers(page) {
        $.get('/users/list?page=' + page + '&size=10', function (data) {
            var userList = $('#user-list');
            userList.empty();
            for (var i = 0; i < data.records.length; i++) {
                var user = data.records[i];
                userList.append('<tr><td>' + user.id + '</td><td>' + user.name + '</td><td>' + user.email + '</td></tr>');
            }
            currentPage = data.current;
            updatePagination(data.pages);
        });
    }

    function updatePagination(totalPages) {
        var pagination = $('.pagination');
        var prevPage = $('#prev-page');
        var nextPage = $('#next-page');
        pagination.find('.page-item').remove();
        pagination.append(prevPage);
        for (var i = 1; i <= totalPages; i++) {
            var pageItem = $('<li class="page-item" id="page-' + i + '"><a class="page-link" href="#">' + i + '</a></li>');
            if (i === currentPage) {
                pageItem.addClass('active');
            }
            pagination.append(pageItem);
        }
        pagination.append(nextPage);
        prevPage.toggleClass('disabled', currentPage === 1);
        nextPage.toggleClass('disabled', currentPage === totalPages);
    }

    loadUsers(currentPage);

    $('.pagination').on('click', 'a', function (event) {
        event.preventDefault();
        var pageLink = $(this);
        if (pageLink.parent().hasClass('disabled') || pageLink.parent().hasClass('active')) {
            return;
        }
        var page = parseInt(pageLink.text());
        if (isNaN(page)) {
            if (pageLink.parent().attr('id') === 'prev-page') {
                page = currentPage - 1;
            } else {
                page = currentPage + 1;
            }
        }
        loadUsers(page);
    });
});

在这个示例中，我们使用了Bootstrap的分页样式，将分页结果显示为表格。在页面加载时，我们调用loadUsers函数来加载第一页的用户数据，同时更新分页条。当用户点击分页条上的按钮时，我们使用jQuery的事件处理函数来加载相应页面的数据。在加载数据时，我们向后端发送一个GET请求，带有当前页码和每页大小的参数，后端返回一个Page对象，其中包含了当前页码、总页数和页码对应的数据。我们在回调函数中遍历数据并将其添加到表格中，同时更新分页条。