为 table 的每一行中的特定列应用 jquery 脚本

Question

我正在为每一行创建一个 table 中的动态下拉列表，其中我 select 一个 select 列表中的一门课程以及与之关联的类显示在第二个下拉列表中。

我能够使用 jQuery 和 ajax 执行此操作，但问题是这仅适用于 table 的第一行，而不适用于 [=] 的其余行27=].

下面是我正在使用的 jQuery 代码。

 $(function () {
            $("#table").each(function () {
                $("#CourseName").change(function () {
                    alert("changed");
                    $.ajax({
                        type: 'Post',
                        url: '/RegisterStudents/GetClass',
                        dataType: 'json',
                        data: { id: $("#CourseName").val() },

                        success: function (data) {
                            var items = '';
                            $("#ClassName").empty;
                            $.each(data, function (i, row) {
                                items += '<option value="' + row.value + '">' + row.text + '</option>'
                            });
                            $("#ClassName").html(items);
                        }
                    })
                })

            });

        });

我希望 jQuery 脚本适用于 table 每一行中的所有下拉列表。

Answer 1

在我看来你的每行都有相同的 Id=classname select 所以 jquery 不知道要更改哪一行。要么具有唯一 ID 并找到与该行相关联的方法，要么使用 jquery 最接近查找要更改的行 select。这 link 可能会为您指明正确的方向。

Getting next closest select element with jquery

为 table 的每一行中的特定列应用 jquery 脚本

Applying jquery script for a particular column in every row of a table

html

c#

jquery

razor-pages