Question

我在自己的.js文件中有以下JavaScript代码，它试图使用类＆＃34; mailing-address-controls＆＃34;来隐藏/取消隐藏div。取决于＆＃34; mailing-address-checkbox＆＃34;检查。我喜欢这种情况发生在页面加载和＆amp;如果复选框值已更改：

<img key={i} src={ require(`../../assets/${image}`) } />

我有以下Razor .cshtml代码，用于定义＆＃34; mailing-address-checkbox＆＃34;和＃34; mailing-address-controls＆＃34;：

$(document).ready(() => {

    function mailingAddressCheckbox() {
        if ($(this).is(":checked"))
            $(".mailing-address-controls").addClass("hidden");
        else
            $(".mailing-address-controls").removeClass("hidden");
    }

    $(".mailing-address-checkbox").load(mailingAddressCheckbox);
    $(".mailing-address-checkbox").change(mailingAddressCheckbox);
});

然而，似乎永远不会调用<label class="control"> @Html.CheckBoxFor(model => model.IsMailingSameAsPhysical, new { @class = "mailing-address-checkbox" }) @Html.LabelFor(model => model.IsMailingSameAsPhysical) </label> <div class="mailing-address-controls df fww cols hidden"> ...... </div>函数，当我选中/取消选中复选框时，没有任何反应。我做错了什么？

Answer 1

jQuery .load()不是每个人说的事件监听器，而是一个在页面中加载远程内容的函数。

没有任何类似的事件你可以直接在元素上使用......如果你真的需要那种事件来触发你的功能，也许.ready()可以完成这项工作。

修改

要在页面加载时触发该功能，同时保持其编码方式，您只需在所需复选框上触发更改事件： $(".mailing-address-checkbox").trigger("change");

在此行之后包含该行，它应按预期工作：

$(".mailing-address-checkbox").change(mailingAddressCheckbox);

触发更改事件不会更改值，但会执行与事件关联的功能。您可以在jQuery documentation。
中详细了解相关信息

尝试隐藏/取消隐藏div时未调用JavaScript函数

1 个答案: