select и jQuery
Сегодня совершенно случайно наткнулся на глюк при обработке события click()
для <option>
, находящихся внутри <select>
. При чем, глюк этот был только в хроме.
Вот исходный (глючащий) вариант:
HTML
<select id="selSize">
<option selected="selected" value="86">ширина: 3 м, длина: 5 м</option>
<option value="83">ширина: 3 м, длина: 4 м</option>
<option value="82">ширина: 3 м, длина: 3 м</option>
<option value="72">ширина: 2.5 м, длина: 3.5 м</option>
</select>
jQuery
var RowExists=false;
// Обработка выбора пункта селекта
function calcPrice(){
// какие нибудь действия, например:
alert($('#selSize :selected').val());
}
// Обработка спец цены
function calcPriceSpec(sc){
// какие нибудь действия, например:
alert($(sc).val());
}
$(document).ready(function(){
$('#selSize').change(calcPrice);
$('.calcPriceSpec').click(calcPriceSpec);
});
Вот такой вот незамысловатый код. Знаю, что лучше было сделать обработку в том же change
, но тогда я как то не подумал, что click
может так подставить.
Проблемма в том, что Google Chrome, по неизвестным мне причинам, не обрабатывал событие click
, хотя все остальные браузеры, даже «всеми любимый» IE, это событие обрабатывали.
Пришлось сделать по человечески ? Вот так:
HTML
<select id="selSize">
<option selected="selected" value="86">ширина: 3 м, длина: 5 м</option>
<option value="83">ширина: 3 м, длина: 4 м</option>
<option value="82">ширина: 3 м, длина: 3 м</option>
<option value="72">ширина: 2.5 м, длина: 3.5 м</option>
</select>
jQuery
var RowExists=false;
// Обработка выбора пункта селекта
function calcPrice(){
// какие нибудь действия, например:
switch($('#selSize :selected').attr('class')){
case: 'calcPriceSpec':
alert('Посдчет спец цены');
break;
default:
alert('Посдчет нормальной цены');
break;
}
}
$(document).ready(function(){
$('#selSize').change(calcPrice);
});
Теги: HTML, jQuery, Web-programing