【问题标题】:jQuery to update checkbox value, depending on radio field?jQuery更新复选框值,取决于单选字段?
【发布时间】:2017-12-05 14:54:29
【问题描述】:

目标是将复选框字段更新为 TRUE 或 FALSE,具体取决于选择的单选按钮选项。如果我选择 FALSE,则必须取消选中复选框。

如果我选择 TRUE,我只能勾选复选框。是因为我把它定义为一个值吗?

     $(function() {
var MAIN= $("input[type='radio'][value='TRUE']");
var marketing1 = $("input[type='checkbox'][value='']");
var marketing2 = $("input[type='checkbox'][value='']");

    MAIN.on('change', function()
        {
      if ($(this).val() == "TRUE")  {
             marketing1.prop('checked',this.checked);
             marketing2.prop('checked',this.checked);
        } if ($(this).val() == "FALSE") {
             marketing1.prop('checked',this.checked, false);
             marketing2.prop('checked',this.checked, false);
        }

    });
});

来自 HTML

     <input type="radio" name="MAIN" value="TRUE"/> Yes
     <input type="radio" name="MAIN" value="FALSE"/> No

First -  <input type="checkbox" name="marketing1" value=""/>
Second -  <input type="checkbox" name="marketing2" value=""/> 

【问题讨论】:

  • 尝试像这样使用真假:“marketing1.prop('checked', true);”
  • 您好 Rasmus,感谢您的意见。不幸的是,该概念的错误版本没有清除复选框字段中的值。

标签: javascript jquery html checkbox


【解决方案1】:

不需要thischecked。我已经调整了你的代码:

$(function() {
  var MAIN= $("input[type='radio']");
  var marketing1 = $("input[type='checkbox'][name='marketing1']");
  var marketing2 = $("input[type='checkbox'][name='marketing2']");

    MAIN.on('change', function()
        {
        if ($(this).val() == "TRUE")  {
          marketing1.prop('checked',true);
          marketing2.prop('checked',true);
        } else {
          marketing1.prop('checked',false);
          marketing2.prop('checked',false);
        }

    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<input type="radio" name="MAIN" value="TRUE"/> Yes
<input type="radio" name="MAIN" value="FALSE"/> No
<br>
First -  <input type="checkbox" name="marketing1" value=""/>
Second -  <input type="checkbox" name="marketing2" value=""/> 

【讨论】:

  • @Atheri 没问题,很乐意提供帮助。
猜你喜欢
  • 1970-01-01
  • 2020-05-02
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2012-05-23
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多