layui单击一行直接选中

layui单击一行选中单选框
layui的table单击行勾选checkbox功能

var num = 0;//全局变量,防止重复点击
        //监听行单击事件(双击事件为:rowDouble)
        table.on('row(test)', function(obj) { //lay-filter="test"
            var selector = obj.tr.selector;//获取选中的data-index
            if (num != selector) {
                num = selector;//必须放在前面,后续点击依然会触发该方法
                $(".layui-table-view[lay-id='reload'] "+selector+" .layui-form-radio").click();//lay-id 是模板的id
            }

        });

layui加载数据完成后默认选中第一行

,id: 'reload'
            , done: function (res, curr, count) {
            $(".layui-table-view[lay-id='reload'] .layui-table-body tr[data-index = '0' ] .layui-form-radio").click();
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
可以实现单击表格的某一行选中功能。和双击选中类似,我们可以通过在 `Table` 组件中使用 `onRow` 属性,为每一行添加单击事件回调函数,来实现单击选中一行的功能。在回调函数中,可以通过 `rowSelection` 组件提供的 `onChange` 方法,将选中的行记录下来。 以下是一个示例代码: ```jsx import React, { useState } from 'react'; import { Table } from 'antd'; const dataSource = [ { key: '1', name: 'John Doe', age: 32 }, { key: '2', name: 'Jane Smith', age: 28 }, { key: '3', name: 'Bob Johnson', age: 45 }, ]; const columns = [ { title: 'Name', dataIndex: 'name', key: 'name' }, { title: 'Age', dataIndex: 'age', key: 'age' }, ]; function TableWithClickSelection() { const [selectedRowKeys, setSelectedRowKeys] = useState([]); const handleRowClick = (record) => { setSelectedRowKeys([record.key]); }; const rowSelection = { selectedRowKeys, onChange: (selectedRowKeys, selectedRows) => { setSelectedRowKeys(selectedRowKeys); }, }; const rowProps = (record) => { return { onClick: () => handleRowClick(record), }; }; return ( <Table dataSource={dataSource} columns={columns} rowSelection={rowSelection} onRow={rowProps} /> ); } export default TableWithClickSelection; ``` 在上面的示例中,我们首先定义了一个 `selectedRowKeys` 状态,用来记录选中的行。然后,在 `handleRowClick` 回调函数中,我们根据单击的行数据,设置 `selectedRowKeys` 状态。最后,在 `rowProps` 回调函数中,我们将单击事件绑定到每一行上。 这样,当用户单击一行时,会触发 `handleRowClick` 回调函数,更新 `selectedRowKeys` 状态,并通过 `rowSelection` 组件提供的 `onChange` 方法,将选中的行记录下来。同时,由于我们使用了 `onRow` 属性,所以每一行都会绑定单击事件。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值