Chrome下拉列表问题

我遇到Chrome问题。我有一个下拉列表。除Chrome之外，它运行良好。然而，使用chrome，它首先会添加一个空元素。Chrome下拉列表问题

HTML部分：

<head> 
<script type="text/javascript">  
    $(document).ready(function() { 
    townDistrictObject.bind({cityId:1}); 
}); 
</script> 
</head> 
    <body>    
     <div class="left marginleft15"> 
      <p>Town</p> 
      <p> 
       <select name="town1" id="townId" style="width: 152px;"> 
        <option selected="selected" value="999999999">Whole Istanbul</option> 
        <option value="999999998">Anatolian Part</option> 
       </select> 
      </p> 
     </div> 
     <div class="left marginleft15"> 
      <p>District</p> 
      <p> 
       <select id="districtId" name="districtid1" style="width: 174px;" > 
        <option selected="selected" value="0">Whole Districts</option> 
       </select> 
      </p> 
     </div> 
    </body>

有类似的东西在脚本的一面：

var townDistrictObject = { 
    defaults : { 
     cityId :1, 
     townElementId : "townId", 
     districtElementId : "districtId", 
     allDistricts: true 
}, 

bind : function(options) { 
    $.extend(this.defaults, options); 
    var that = this; 
    var opts = this.defaults; 
    var townElement = $('#' + opts.townElementId); 
    townElement.val(0);   
} 
};

的问题说明：

首先，有一个空元素在列表顶部uldn't是！）

enter image description here