这让我完全疯了。我无法弄清楚如何通过JavaScript检查/取消选中复选框。
我的HTML文件中有以下内容:
<div class="form-group">
<label class="col-sm-3 control-label"></label>
<div class="col-sm-9">
<div class="checkbox">
<input id="hardhat" type="checkbox" name="hardhat" checked="false" class="flat"/> Does the employee need his own hardhat?
</div>
</div>
</div>
在Jade中将其转化为:
.form-group
label.col-sm-3.control-label
.col-sm-9
.checkbox
input#hardhat(type='checkbox', name='hardhat', class='flat', checked='false')
| Does the employee need his own hardhat?
在HTML中使用checked属性将始终打开窗口并选中复选框。取消选中该复选框的唯一方法是删除checked属性。我错过了什么?
因此,我在JavaScript中没有检查/取消选中该复选框的工作:(。我试过这个:
var $modal = $('#editJob');
$modal.find('input#hardhat')['checked']=true;
非常感谢任何帮助!
function showJobInfo(event) {
document.getElementById('editJob').style.display = "block";
document.getElementById('editJob').style.visibility = "visible";
// Prevent Link from Firing
event.preventDefault();
// Retrieve job title from link rel attribute
var thisJobTitle = $(this).attr('rel');
// Get Index of object based on id value
var arrayPosition = userJoblistData.map(function(arrayItem) { return arrayItem.title; }).indexOf(thisJobTitle);
// Get our Job Object
var thisJobObject = userJoblistData[arrayPosition];
// Populate the edit job popup window
var $modal = $('#editJob');
$modal.find('input#jobTitle').val(thisJobObject.title);
$modal.find('input#payRate').val(thisJobObject.payrate);
$modal.find('input#startDate').val(thisJobObject.durationstart);
$modal.find('input#endDate').val(thisJobObject.durationend);
$modal.find('input#workingHours').val(thisJobObject.workinghrs);
$modal.find('input#location').val(thisJobObject.location);
$('#hardhat').prop('checked', false);
}
答案 0 :(得分:0)
我不明白是什么问题。如果您想要始终选中,请添加checked =&#34; true&#34; html属性。
https://jsfiddle.net/yw3obrrt/
<input id="hardhat" type="checkbox" name="hardhat" checked="true" class="flat"/>
检查玉器检查=&#39; true&#39;
input#hardhat(type='checkbox', name='hardhat', class='flat', checked='true')
| Does the employee need his own hardhat?
对于测试,请不要使用F5,因为请记住您的选择。
如果不起作用..尝试使用jquery并使用
$(document).ready(function (){
$("#hardhat").attr("checked",true);
});
答案 1 :(得分:0)
在你的例子中!!
$('#hardhat').prop('checked', false);
这一行,未选中复选框!
更改为
$('#hardhat').attr('checked', true); // attr or prop
或对此进行评论并在html输入中添加checked =“true”!