javascript - 如何在更改事件中获取复选框的数据元素

标签 javascript jquery html asp.net-mvc checkbox

我有一个动态的项目表,每个项目旁边都有复选框。当用户选择一个复选框时,我想从表中获取“名称”项并将其添加到文本框中。看图:

enter image description here

我尝试实现此目的的方法是向每个复选框添加一个“更改”事件,并使用文本名称填充它的“data-name”元素。

<tbody>
            @foreach (var item in Model.Items)
            {
                <tr>
                    <td><input type="checkbox" name="selectBox" data-name="@item.Name" /></td>

如您所见,我正在使用项目名称填充数据名称,作为绕过直接拉取它的方法(我不知道该怎么做)。现在在 javascript/jquery 中,我将事件绑定(bind)到每个复选框并尝试使用以下代码获取数据元素:

$('input[name=selectBox]').change(function (item) {
    var text = $(item).attr('data-name');
});

当代码运行时,所有复选框都会触发事件,但当我希望它是名称数据时,“文本”是未定义的。

寻找我的方法的答案和/或更好的方法,包括一起跳过数据元素并直接获取名称值。感谢您的关注。

最佳答案

试试这个:

var text = $(this).data('name');

change 函数的第一个参数是事件,而不是元素本身。此外,jQuery 自动将函数作用域 (this) 设置为要更改的元素。

参见 Documentation

关于javascript - 如何在更改事件中获取复选框的数据元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33548843/

相关文章:

javascript - HTML/Javascript 页面转换

jQuery 按数据顺序淡入淡出

html - href 之间的空间

html - 使用 BEM 命名方法编写 CSS 时如何实现主题?

javascript - 有没有建立方便的javascript回调写法?

Javascript 在本地和服务器上的行为不同

javascript - 在一段时间内增加值 JS

javascript - 添加/删除 css 类以响应组件

html - CSS 媒体查询帮助

javascript - 在我的 Ionic 应用程序中使用 Angular 过滤器 groupBy 时出现未知提供程序错误