Jquery attr不是为了必需而工作,而是为了标题

时间:2016-06-12 16:58:11

标签: jquery

我在使用以下内容时遇到问题:

$("input[name='choice']").change(function() {
if($('#opt_2').is(':checked')) {
  $('#email').attr('required', true);
  $('#reasonreport').attr('required', true);
} else {
  $('#email').removeAttr('required');
  $('#reasonreport').removeAttr('required');
}
if($('#ch7').is(':checked')) {
  $('#reasonreport').attr('required', true);
} else {
  $('#reasonreport').removeAttr('required');
}

});

电子邮件是电子邮件输入字段

resonreport是textarea输入

当从单选框中选中opt_2时,它会将电子邮件字段更改为required,但不会将reasonreport textarea更改为required。以下工作正常:

$('#reasonreport').attr('title', 'something');

会添加一个标题,但它只是所需的attr不会设置,我已经摸不着头脑了一段时间,并且因为我的生活无法解决原因。

非常感谢任何帮助。谢谢!

1 个答案:

答案 0 :(得分:1)

从根本上说,你所做的事情应该是有效的,因为布尔属性是" true"当他们完全出现(不论价值)和"假"什么时候他们不在。但是,jQuery的attr(仍然)模糊了属性和属性之间的界限,并且在尝试处理属性时不是正确的选择:使用proptrue来启用和false禁用该属性。这也可以让您显着简化代码:

$("input[name='choice']").change(function() {
    $('#email, #reasonreport').prop('required', $('#opt_2').is(':checked'));
    $('#reasonreport').prop('required', $('#ch7').is(':checked'));
});

...但请注意,您还有一个逻辑错误:您根据required {{1}设置了#reasonreport opt_2属性}}状态,然后覆盖基于checked的{​​{1}}状态。您也可以完全删除ch7内容中的checked #reasonreport代码设置;它最终什么都不做。

如果您的目标是要required,如果选中 opt_2#reasonreport ,则需要修改代码。

opt_2

如果目标是在选中 时要求它,请使用ch7代替$("input[name='choice']").change(function() { var opt_2_checked = $('#opt_2').is(':checked'); var ch7_checked = $('#ch7').is(':checked'); $('#email').prop('required', opt_2_checked); $('#reasonreport').prop('required', opt_2_checked && ch7_checked); });