Метод HTML, не загружающий значение с использованием готового документа

Question

Im пытается загрузить значения столбца bowflex при загрузке страницы, однако они не будут отображаться. Событие .change загрузит их, но .ready не делает. Я уверен, что это невероятно глупый контроль с моей стороны, но почему он не загружает значение для «bowflex» при загрузке страницы?

<div id="treadmill" style="float:left; padding-right: 15px;"> 
    <div><h2>Bowflex</h2></div> 
    <div class="comparison1"></div> 
</div> 
<div id="treadmill2" style="float:left; padding-right: 15px;"> 
    <div><select class="row2"> 
      <option value="">Compare With</option> 
      <option value="solo">Solo</option> 
      <option value="nordictrack">Nordictrack</option> 
      <option value="bowflex">Bowflex</option> 
     </select></div> 
    <div class="comparison2"></div> 
</div> 
<div style="clear:both"></div> 

<script> 
    var treadmill_dict = { 
      bowflex: "<div class='motor'>5hp</div><div class='length'>50in</div><div class='weight'>500lbs</div>", 
      solo: "<div class='motor'>4.5hp</div><div class='length'>45in</div><div class='weight'>450lbs</div>", 
      nordictrack: "<div class='motor'>4hp</div><div class='length'>40in</div><div class='weight'>400lbs</div>" 
    }; 

    $(document).ready(function() { 
     $('#treadmill div.comparison1').html(treadmill_dict[bowflex]); 
    }); 

    $(".row2").change(function() { 
     $('#treadmill2 div.comparison2').html(treadmill_dict[$(this).val()]); 
    }); 

</script> 

Answer 1

Если вы собираетесь использовать клавиши JSon является способом:

treadmill_dict[bowflex] 

Вы должны поставить кавычки имя ключа:

treadmill_dict['bowflex'] 

Как это:

var treadmill_dict = { 
    bowflex: "<div class='motor'>5hp</div><div class='length'>50in</div><div class='weight'>500lbs</div>", 
    solo: "<div class='motor'>4.5hp</div><div class='length'>45in</div><div class='weight'>450lbs</div>", 
    nordictrack: "<div class='motor'>4hp</div><div class='length'>40in</div><div class='weight'>400lbs</div>" 
}; 

$(document).ready(function() { 
    alert(treadmill_dict['bowflex']); 
    $('#treadmill div.comparison1').html(treadmill_dict[bowflex]); 
}); 

See it here