jQuery: agrega valores de casillas de verificación al campo de texto de entrada

Estoy tratando de agregar los valores de cualquier casilla de verificación marcada a un campo de texto de entrada. Aquí está mi violín:http://jsfiddle.net/Lf6ky/

$(document).ready(function() {
  $(":checkbox").on('click', function() {
    if ($(':checkbox:checked')) {
      var fields = $(":checkbox").val();
      jQuery.each(fields, function(i, field) {
        $('#field_results').val($('#field_results').val() + field.value + " ");
      });
    }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<input type="text" id="field_results" /><br>

<input type="checkbox" value="1">1<br>
<input type="checkbox" value="2">2<br>
<input type="checkbox" value="3">3

En este ejemplo, tengo 3 casillas de verificación, con los valores 1,2,3. Si hago clic en todas estas casillas de verificación, el campo de entrada debería verse así: 1 2 3

Si desactivo cualquiera de estas casillas de verificación, ese valor correspondiente debería desaparecer en el campo de entrada.

¿Cómo hago esto?