Javascript jQuery-复选框不更新文本_Javascript_Jquery

Javascript jQuery-复选框不更新文本

javascript jquery

Javascript jQuery-复选框不更新文本,javascript,jquery,Javascript,Jquery,我目前正在返回一些文本，这些文本基于选中的复选框。我添加了一个复选框来自动检查所有国家，但不会返回任何文本。不知道我做错了什么下面是代码和小提琴： HTML 您需要显式触发更改事件请注意，更改事件仅由该特定元素上的用户操作触发我所做的更改选中/取消选中时刚刚触发像 $checkCountries.changefunction{ $input[value='1'].prop'checked'，$this.propchecked.trigger'change'； $input[value

我目前正在返回一些文本，这些文本基于选中的复选框。我添加了一个复选框来自动检查所有国家，但不会返回任何文本。不知道我做错了什么

下面是代码和小提琴：

HTML

您需要显式触发更改事件

请注意，更改事件仅由该特定元素上的用户操作触发

我所做的

更改选中/取消选中时刚刚触发

像

$checkCountries.changefunction{ $input[value='1'].prop'checked'，$this.propchecked.trigger'change'； $input[value='2'].prop'checked'，$this.propchecked.trigger'change'； $input[value='3'].prop'checked'，$this.propchecked.trigger'change'； $input[value='4'].prop'checked'，$this.propchecked.trigger'change'； }; $document.readyfunction{ $'.print.val$this.is'：选中“； $'input[value=1]'。changefunction{ 如果$this.is:已选中{ $this.attrchecked，$'.print'.textUSA已选中； }否则{ $'.print'.为空； } $'.print.val$this.is'：选中“； }; $'input[value=2]'。changefunction{ 如果$this.is:已选中{ $this.attrchecked，$'.print2'.textCanada已选中； }否则{ $'.print2'。为空； } $'.print2.val$this.is'：已选中； }; $'input[value=3]'。changefunction{ 如果$this.is:已选中{ $this.attrchecked，$'.print3'.textUK已选中； }否则{ $'.print3'。为空； } $'.print3.val$this.is'：已选中； }; $'input[value=4]'。changefunction{ 如果$this.is:已选中{ $this.attrchecked，$'.print4'.textSpain已选中； }否则{ $'.print4'。为空； } $'.print4'.val$this.is'：选中'； }; $'input[value=10]'。changefunction{ 如果$this.is:已选中{ $this.attrchecked，$'.print10'.textmole已选中； }否则{ $'.print10'.为空； } $'.print10'.val$this.is'：选中'； }; $'input[value=11]'。changefunction{ 如果$this.is:已选中{ $this.attrchecked，$'.print11.textFemale已选中； }否则{ $'.print11'。为空； } $'.print11.val$this.is'：选中'； }; }; 检查国家

大量的复选框美国

加拿大

英国

西班牙

男性

女性

您需要显式触发更改事件

请注意，更改事件仅由该特定元素上的用户操作触发

我所做的

更改选中/取消选中时刚刚触发

像

大量的复选框美国

加拿大

英国

西班牙

男性

女性

我我认为更好的方法是使用单个代码块为每个复选框动态定义复选框单击处理程序

我创造了一个像下面这样的小提琴手

$('.chkCountry').change(function() {

        const val = $(this).val();
        const text = $(this).attr('data');
        if($(this).is(":checked")) {
            $('.print' + val).html(text + " is Checked");
        } else {
        $('.print' + val).html("");
        }

    });

我认为更好的方法是使用单个代码块为每个复选框动态定义复选框单击处理程序

我创造了一个像下面这样的小提琴手

$('.chkCountry').change(function() {

        const val = $(this).val();
        const text = $(this).attr('data');
        if($(this).is(":checked")) {
            $('.print' + val).html(text + " is Checked");
        } else {
        $('.print' + val).html("");
        }

    });

您可以为所有国家/地区指定相同的类名，并按如下方式打印文本

我创建了一个小提琴手，如下所示：

$checkCountries.changefunction{ 如果$this.is:已选中{ $'.chkcountery'.prop'checked'，true； $'.Text'.htmlUSA被选中加拿大被选中英国被选中西班牙被选中； } 否则{ $'.chkCountry'.prop'checked'，false； $'.Text'.Text； } }

您可以为所有国家/地区指定相同的类名，并按如下方式打印文本

我创建了一个小提琴手，如下所示：

要打印的内容。打印div，如果选中此选项？如果我没有错，你想打印这个checkCountries checbox的值吗？你想打印什么。打印div，如果你选中了这个？如果我没说错的话，你想打印这张支票吗？很好！你太棒了！我会在3分钟内接受你的回答！美好的你太棒了！我会在3分钟内接受你的回答！谢谢你的建议谢谢你的建议

$("input[value='1']").prop('checked', $(this).prop("checked")).trigger('change');

$('.chkCountry').change(function() {

        const val = $(this).val();
        const text = $(this).attr('data');
        if($(this).is(":checked")) {
            $('.print' + val).html(text + " is Checked");
        } else {
        $('.print' + val).html("");
        }

    });