Q: jQuery hide and show input value What I'm looking for is when the box is unchecked don't show any values in the inputs and when the box is checked then show every single input with its respective value.
This is my code:
$('#checkbox').change(function() { 
    if($('#checkbox').is(':checked')) {
        $('.test').val('')
    } else {

    }
});


A: one way of doing it is by declaring a variable.
var inputValue;
$('#checkbox').change(function(){ 
    if ($('#checkbox').is(':checked')){
        inputValue = $('.test').val();
        $('.test').val('');
    } else {
        $('.test').val(inputValue);
    }
});

For multiple input fields. The idea of @Rashid is awesome. Store the value in the data-value attribute. And when the checkbox is unchecked you can get the values using data-value attribute.
$('#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'));
});
    }
});


A: You can try this: 


$(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>



A: In your code, you remove the value when #checkbox is checked. That's not how you hide the element. Just use css display to hide/show the element.
$('#checkbox').change(function() { 
    if ($('#checkbox').is(':checked')) {
        $('.test').css('display', 'none');
    } else {
        $('.test').css('display', 'block');
    }
});


A: 

$('#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)

    }
});



A: try this 
<input type="checkbox" id="myCheck"  onclick="myFunction()">

function myFunction() {
  // Get the checkbox
  var checkBox = document.getElementById("myCheck");
  // Get the output text
  var text = document.getElementById("text");

  // If the checkbox is checked, display the output text
  if (checkBox.checked == true){
    text.style.display = "block";
  } else {
    text.style.display = "none";
  }
}


A: I think you should use toggle() jquery function.
$(document).ready(function(){
    $('input[type="checkbox"]').click(function(){
        var item = $(this).attr('name');
        $('input[name="'+item+'"][type="text"]').toggle();
    });
});

also check at fiddle :- http://jsfiddle.net/aaTq3/
