当取消选中复选框时清除特定的表单元素

任何人都可以给我一个基本的示例，说明当取消选中某个复选框时，如何清除特定的表单输入（每个都有自己的唯一ID）？我尝试了一些解决方案，但似乎无法可靠地实现这一功能。我只需要在盒子没有选中时才会发生这种情况，这似乎给我带来了问题。当取消选中复选框时清除特定的表单元素

来源

2012-03-06 Robert E

哪一部分给你的麻烦？ – Jivings 2012-03-06 15:03:08

向我们展示一些代码。什么不起作用？ – MetalFrog 2012-03-06 15:07:13

一个粗略的例子可能是......

<input type='checkbox' id='clear_text' /> 
<input type='text' id='text_box' value='Contents' /> 
<script> 
$(function(){ 
    $("#clear_text").click(function(){ 
     if(!$(this).is(":checked")){ //checks if the checkbox/this is selected or not 
      $("#text_box").val(""); //empty the input value 
     } else { } //nothing 
    }); 
}); 
</script>

来源

2012-03-06 15:09:03 solarise

'checked'状态改变后，'click'（和'change'，这可能是更好的选择）事件触发;所以“如果它被选中，那么我们知道点击将'取消选中'”是不正确的。另外，'this.checked'工作得很好 - 不需要'$（this）.is（'：checked'）'。 – 2012-03-06 15:11:34

是的，我认为这是我的原始代码，我很快就编辑了它。我有点像$（this）.is（“：checked”）语法。它很好地阅读:) – solarise 2012-03-06 15:22:59

虽然喜欢语法并不意味着它不那么不必要。你最终编写更多的代码 - 创建一个对象并执行函数调用 - 获得零增益。 – 2012-03-06 15:26:42

在复选框的onClick（）中，调查复选框的值，然后执行您希望的任何操作，包括清除表单。这是否符合您的需求？

来源

2012-03-06 15:04:39

很简单的例子，让你开始。使用jQuery 1.7.1。 http://jsfiddle.net/fPKX8/

HTML：

<input id="in1" name="in1" value="pizza" /><br /> 
<input id="in2" name="in2" value="chips" /><br /> 
<input id="in3" name="in3" value="beer" /><br /> 

<input id="check1" name="check1" type="checkbox" />

的jQuery：

$('#check1').on('click', function() { 
    if (!$(this).is(':checked')) { 
     $('#in1, #in2').val(''); 
    } 
});

来源

2012-03-06 15:10:28 nachito

$(document).ready(function(){ 
    $('#chk').live('change',function(){ 
    if(!$(this).is(':checked')) 
     $('input').val('');    
    }); 
});

这里是工作提琴JSFiddle

来源

2012-03-06 15:15:33 FosterZ

我不得不与另一个解决方案发布，因为这与其他一些js与#chk进行冲突。但是，开箱即可按照预期工作。感谢您的时间！ – 2012-03-06 16:25:29

当取消选中复选框时清除特定的表单元素

回答

相关问题