关于jQuery操作下拉框

今天脑抽了一下，然后给自己挖了一个坑，不过解决了也更清楚这个问题。

开始是这样的：

<select id="province-select">
            <option >选择省份</option>
            <option class='pro_id'  pro_id="1">name1</option>
            <option class='pro_id'  pro_id="2">name2</option>
            <option class='pro_id'  pro_id="3">name3</option>
            <option class='pro_id'  pro_id="4">name4</option>
            <option class='pro_id'  pro_id="5">name5</option>
            <option class='pro_id'  pro_id="6">name6</option>
</select>
<script>
$('.pro-select').click(function(){
   var province_id=$(this).attr('pro_id');
   var province_response=xxx.ajaxRequest('<{flink ctl="city:city_list"}>',{'province_id':province_id},false);
   var city_list='<option>选择城市</option>';
   for (pro_id in province_response)
   {
      console.log(province_response[pro_id].link);
      city_list+='<option class="city-name" href="'+province_response[pro_id].link+'" >'+province_response[pro_id].name+'</option>';
   }
   $('#city-select').html(city_list);
});
</script>

然后发现死活都不触发这段js代码，然后百度一下……发现自己想错了。

<select>标签是通过Onchange来触发的……所以写了如下代码

<select id="province-select">
            <option >选择省份</option>
            <option  value="1">name1</option>
            <option  value="2">name2</option>
            <option  value="3">name3</option>
            <option  value="4">name4</option>
            <option  value="5">name5</option>
            <option  value="6">nam6e</option>
</select>
<script>
$('#province-select').change(function(){
        var province_id=$(this).val();
        var province_response=xxx.ajaxRequest('<{flink ctl="city:city_list"}>',{'province_id':province_id},false);
        var city_list='<option>选择城市</option>';
        for (pro_id in province_response)
        {
            city_list+='<option class="city-name" href="'+province_response[pro_id].link+'" >'+province_response[pro_id].name+'</option>';
        }
        $('#city-select').html(city_list);
    });
</script>

解决问题～

刚才又找到一种方法：

<script>
    $(this).find('option:selected').html();
     $(this).find('option:selected').attr();
</script>