Question

我要寻找的是未选中该框时，在输入中不显示任何值，而选中该框后，则显示每个输入及其相应值。

这是我的代码：

$('#checkbox').change(function() { 
    if($('#checkbox').is(':checked')) {
        $('.test').val('')
    } else {

    }
});

Answer 1

一种实现方法是声明一个变量。

var inputValue;
$('#checkbox').change(function(){ 
    if ($('#checkbox').is(':checked')){
        inputValue = $('.test').val();
        $('.test').val('');
    } else {
        $('.test').val(inputValue);
    }
});

用于多个输入字段。 @Rashid的想法很棒。将值存储在data-value属性中。取消选中该复选框后，您可以使用data-value属性获取值。

$('#checkbox').change(function() { 
    if($('#checkbox').is(':checked')) {
    $.each($('.test'),function(){
      $(this).attr('data-value',$(this).val()).val("");
    });

    } else {
$.each($('.test'),function(){
      $(this).val($(this).attr('data-value'));
});
    }
});

Answer 2

您可以尝试以下方法：

$(document).ready(function(){
	$('input[type="checkbox"]').click(function(){ 
    var $this = $(this);
		var $item = $this.attr('name');
		var $input = $('input[name="'+$item+'"][type="text"]');
    var $inputValue = $input.val();
		
		if ($this.is(':checked')){
			$input.data('oldvalue',$inputValue);
			$input.val('');
		} else {
			$input.val($input.data('oldvalue'));
		}
	});
});

	body{line-height: 1.5;}
	input{display: block;margin: 10px 0 0;}
	input[type="checkbox"] { display: inline;}
	label{ margin: 0 10px 0 5px;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="options">
		<input type="checkbox" name="title"><label>Title</label>
		<input type="checkbox" name="author"><label>Author</label>
		<input type="checkbox" name="category"><label>Category</label>
	</div>
	<div class="container">
		<form method="post">
			<input type="text" name="title" placeholder="Title:">
			<input type="text" name="author" placeholder="Author:">
			<input type="text" name="category" placeholder="Category:">
			<input type="submit" value="Submit">
		</form>
</div>

Answer 3

在代码中，选中#checkbox时将删除该值。这不是隐藏元素的方式。只需使用css display即可隐藏/显示元素。

$('#checkbox').change(function() { 
    if ($('#checkbox').is(':checked')) {
        $('.test').css('display', 'none');
    } else {
        $('.test').css('display', 'block');
    }
});

Answer 4

$('#checkbox').change(function() { 
    if($('#checkbox').is(':checked')) {

        var value = $('.test').val()
        $('.test').data('value',value).val('')

    } else {

        var value = $('.test').data('value')
        $('.test').val(value)

    }
});

Answer 5

尝试

"0 0 21 * * TUE"

Answer 6

我认为您应该使用toggle() jQuery函数。

$(document).ready(function(){
    $('input[type="checkbox"]').click(function(){
        var item = $(this).attr('name');
        $('input[name="'+item+'"][type="text"]').toggle();
    });
});

还要检查小提琴：-http://jsfiddle.net/aaTq3/

jQuery隐藏和显示输入值

6 个答案: