Jquery addClass 不是函数

Question

我想要的是：

我想制作一个表单，根据联系人类型显示不同的输入字段（用户可以从下拉列表中选择联系人类型）。我尝试过 jQuery，但我有两个错误。

我如何尝试：

function showContact() {
/* */
    $('#userType').change(function(){
        var value = $(this).val();

        console.log(value);
        var member = document.getElementById("private");
        var corporation = document.getElementById("corporation");

        if (value == 1) {
            member.removeClass('hidden');
            corporation.removeClass('hidden').addClass('hidden');

            return;
        } else if (value == 2) {
            member.removeClass('hidden').addClass('hidden');
            corporation.removeClass('hidden');

            return;
        } else {
            member.removeClass('hidden').addClass('hidden');
            corporation.removeClass('hidden').addClass('hidden');

            return;
        }
    });
}

什么错误：

1：脚本仅在第二个下拉列表更改时启动。我想从第一个变化开始。

2：当我更改时，出现此错误：

类型错误：member.removeClass 不是函数

有什么问题？

Answer 1

假设其他一切正常。改变：

var member = document.getElementById("private");

到

var member = $("#private");

Answer 2

1：脚本仅在第二个下拉列表更改时启动。我想从第一个变化开始。

这将取决于如何showContact调用。在不知道这些信息的情况下很难说。请注意，它应该只被调用一次，可能是在 DOM 加载后，因为它绑定了一个事件处理程序。

2：当我更改时，出现此错误：

TypeError: member.removeClass is not a function

member，一个 DOM 节点，没有removeClass方法。要解决此问题，您可以执行以下两项操作之一：

• member.classList.remove("hidden") （使用原生 API）
• $(member).removeClass("hidden") （创建一个 jQuery 对象，并使用 jQuery 的 API）

此外，每次调用都会先删除hidden该类，然后再将其添加回来。这最终似乎没有任何影响。

// What has been gained here?
$(member).removeClass('hidden').addClass('hidden');

如果您希望确保该类不会在元素上重复，则无需担心。本机 API 和 jQuery 都会阻止这种情况发生。

Answer 3

因为corporation是 DOM 元素，而不是 jQuery 节点，并且您尝试在其上使用 jQuery 函数。将其包装在 jQuery 选择器中，例如$(corporation)

jsFiddle 示例