<form id="my-form" action="" method="get">
<p>
    <label for="username-1">Disabled Username</label>
    <input id="username-1" name="username-1" disabled value="AaronGustafson">
  </p>                                       <p>
    <label for="username-2">Readonly Username</label>
    <input id="username-2" name="username-2" readonly value="AaronGustafson">
  </p>
  <p>
    <button type="submit">Traditional GET Submission</button>
  </p>
</form>

body {
  margin: 0 1em;
}
label, input, button, output {
  display: block;
}
label {
  font-weight: bold;
}
input, button, output {
  margin-bottom: .5em;
}
output {
  margin-bottom: .5em;
  font-family: monospace;
  width: auto;
}

var $form = document.getElementById('my-form'),
    $button_1 = document.createElement('button'),
    $button_2 = $button_1.cloneNode(true),
    $output = document.createElement('output');

function gatherFields(){
  gatherFormValues(false);
}
function gatherFieldsPerSpec()
{
  gatherFormValues(true);
}

function gatherFormValues( per_spec )
{
  var $fields = $form.elements,
      i = 0,
      f = $fields.length,
      $field,
      obj = {};
  console.log(obj);
  while ( i < f )
  {
    $field = $fields[i++];
    if ( $field.name && $field.value )
    {
      if ( ! per_spec ||
           ( per_spec && ! $field.disabled ) )
      {
        obj[$field.name] = $field.value;
      }
    }
  }
  $output.value = null;
  $output.value = JSON.stringify(obj);
}

$button_1.innerText = 'Gather Fields in JS';
$button_1.type = 'button';
$button_1.addEventListener('click',gatherFields,false);
$form.appendChild($button_1);
$button_2.innerText = 'Gather Fields in JS per the Spec';
$button_2.type = 'button';
$button_2.addEventListener('click',gatherFieldsPerSpec,false);
$form.appendChild($button_2);
$form.appendChild($output);