select下拉框中的option是没有onclick事件的，但是如果是想某一个option发生变化，可以试着用select的onchange事件来操作option中的属性。注意在firefox中是可以实现option的单击事件的，其他浏览器IE、Google是不支持的。
在火狐firefox中这段代码是可以执行出来的：
<select name="tableType">
<option onclick="year();" value="1">年报</option>
<option onclick="halfYear();" value="2">半年报</option>
<option onclick="quarterly();" value="3">季报</option>
<option onclick="month();" value="4">月报</option>
</select>
但是在其他浏览器则是不支持的，可能跟浏览器的内核以及对CSS、JS、HTML的国际标准的符合情况不一样有关系。
如果是这样的话，考虑到浏览器的兼容性，可以用select标签的onchange事件通过option的value属性来控制option的部分功能。
<select id="tableType" name="tableType" onchange="getTableType();">
<option value="1">年报</option>
<option value="2">半年报</option>
<option value="3">季报</option>
<option value="4">月报</option>
</select>
JS中，可以获取option的value值来改变某一个option的样式以及其他的东西。我这里只是改变了某一些标签的样式。
function getTableType(){
var value=$("#tableType").val();
/*alert(value);*/
if(value==\'1\'){
$(\'.halfYear\').css(\'display\',\'none\');
$(\'.quarterly\').css(\'display\',\'none\');
$(\'.month\').css(\'display\',\'none\');
}
if(value==\'2\'){
$(\'.halfYear\').css(\'display\',\'block\');
$(\'.quarterly\').css(\'display\',\'none\');
$(\'.month\').css(\'display\',\'none\');
}
if(value==\'3\'){
$(\'.halfYear\').css(\'display\',\'none\');
$(\'.month\').css(\'display\',\'none\');
$(\'.quarterly\').css(\'display\',\'block\');
}
if(value==\'4\'){
$(\'.halfYear\').css(\'display\',\'none\');
$(\'.quarterly\').css(\'display\',\'none\');
$(\'.month\').css(\'display\',\'block\');
}
};
慢慢积累，水滴石穿。合抱之木，生于毫末；九层之台，起于累土；千里之行，始于足下。这是出自老子的《道德经》。