题
我已经用在你的鼠标悬停和y和鼠标移开做X悬停功能。我想同样的点击,但它似乎并没有工作:
$('.offer').click(function(){
$(this).find(':checkbox').attr('checked', true );
},function(){
$(this).find(':checkbox').attr('checked', false );
});
我想在div
点击时,如果再次单击要检查的复选框,和未选中 - 点击切换
解决方案
这很容易通过在每次点击翻转的复选框的当前“检查”状态完成。例子:
$(".offer").on("click", function () {
var $checkbox = $(this).find(':checkbox');
$checkbox.attr('checked', !$checkbox.attr('checked'));
});
或:
$(".offer").on("click", function () {
var $checkbox = $(this).find(':checkbox');
$checkbox.attr('checked', !$checkbox.is(':checked'));
});
或,通过直接操作DOM '检查' 属性(即,不使用attr()
至取所点击复选框的当前状态):
$(".offer").on("click", function () {
var $checkbox = $(this).find(':checkbox');
$checkbox.attr('checked', !$checkbox[0].checked);
});
...等等。
注意:因为jQuery的1.6,复选框应该使用prop
不attr
设置:
$(".offer").on("click", function () {
var $checkbox = $(this).find(':checkbox');
$checkbox.prop('checked', !$checkbox[0].checked);
});
其他提示
另一种方法是,以这样的扩展的jquery:
$.fn.toggleCheckbox = function() {
this.attr('checked', !this.attr('checked'));
}
然后调用:
$('.offer').find(':checkbox').toggleCheckbox();
警告:使用的 ATTR()或<强>丙()以改变复选框的状态的不强>火的变化事件在我和测试的大多数浏览器。选中的状态会改变,但没有事件冒泡。您必须设置检查属性后手动触发更改事件。我有一些其他的事件处理程序监视复选框的状态,他们将很好地工作直接用户点击。但是,以编程方式设置的选中状态未能持续触发这种改变事件。
1.6的jQuery
$('.offer').bind('click', function(){
var $checkbox = $(this).find(':checkbox');
$checkbox[0].checked = !$checkbox[0].checked;
$checkbox.trigger('change'); //<- Works in IE6 - IE9, Chrome, Firefox
});
您可以使用 toggle
功能:
$('.offer').toggle(function() {
$(this).find(':checkbox').attr('checked', true);
}, function() {
$(this).find(':checkbox').attr('checked', false);
});
为什么不在一条线?
$('.offer').click(function(){
$(this).find(':checkbox').attr('checked', !$(this).find(':checkbox').attr('checked'));
});
我有一个单一的复选框名为chkDueDate
和一个点击事件的HTML对象如下:
$('#chkDueDate').attr('checked', !$('#chkDueDate').is(':checked'));
点击HTML对象(在此情况下的<span>
)切换复选框的选中属性。
的jQuery:最佳方式,委托的操作将jQuery(jQuery的= jQuery的)
$( "input[type='checkbox']" ).prop( "checked", function( i, val ) {
return !val;
});
尝试改变这样的:
$(this).find(':checkbox').attr('checked', true );
这样:
$(this).find(':checkbox').attr('checked', 'checked');
不是100%肯定这是否会做,但我似乎记得有类似的问题。祝你好运!
$('.offer').click(function(){
if ($(this).find(':checkbox').is(':checked'))
{
$(this).find(':checkbox').attr('checked', false);
}else{
$(this).find(':checkbox').attr('checked', true);
}
});
在JQuery的我不认为点击()接受两个函数,用于切换。您应该使用的切换()函数: http://docs.jquery.com/Events/toggle
$('.offer').click(function() {
$(':checkbox', this).each(function() {
this.checked = !this.checked;
});
});
最简单的解决方案
$('.offer').click(function(){
var cc = $(this).attr('checked') == undefined ? false : true;
$(this).find(':checkbox').attr('checked',cc);
});
<label>
<input
type="checkbox"
onclick="$('input[type=checkbox]').attr('checked', $(this).is(':checked'));"
/>
Check all
</label>
另一种替代的解决方案,以切换复选框值:
<div id="parent">
<img src="" class="avatar" />
<input type="checkbox" name="" />
</div>
$("img.avatar").click(function(){
var op = !$(this).parent().find(':checkbox').attr('checked');
$(this).parent().find(':checkbox').attr('checked', op);
});
$('controlCheckBox').click(function(){
var temp = $(this).prop('checked');
$('controlledCheckBoxes').prop('checked', temp);
});
不隶属于 StackOverflow