Как отключить Изображение с помощью имени класса.. использование jQuery
$(".ui-datepicker-trigger").attr('disabled',true);
Я пытаюсь отключить Кнопку с изображением что-то вроде этого.. но не работа
но если я делаю его работу
$(".ui-datepicker-trigger").hide(); скройтесь wokring, но отключенный не работает?
какое-либо тело может сказать мне?
спасибо
2 ответа
Datepicker имеет для этого встроенный метод disable , который также отключает ввод текста, например:
$("#datepicker").datepicker("disable");
Вы можете просмотреть демонстрацию здесь , вы по возможности нужно использовать этот метод, потому что средство выбора даты фактически отслеживает, что отключено внутри, вы можете увидеть исходный код здесь .
В качестве альтернативы можно было бы вручную .unbind () щелкнуть по этому изображению, например:
$(".ui-datepicker-trigger").css({opacity:'0.5',cursor:'default'}).unbind('click');
Вы можете увидеть демонстрацию этого здесь , часть .css () предназначена только для того, чтобы придать ему "отключенный" стиль :)
Я добавил img и привязал обработчик клика с помощью jQuery. Поэтому, когда я отключаю все остальное, я также отвязываю обработчик нажатия, поэтому кнопка с изображением больше не работает. В любом случае, вот обновленный рабочий пример. Я протестировал это в IE и FF. Дайте мне знать, как это происходит.
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(event){
alert("you clicked the link, everything should be disabled now.");
$(".ui-datepicker-trigger").attr('disabled',true);
$("img.ui-datepicker-trigger").unbind('click');
});
// add a click handler for the img element
$("img.ui-datepicker-trigger").bind('click', function() {alert('clicked the img');});
});
</script>
</head>
<body>
<button class="ui-datepicker-trigger">Disable Everything</button>
<br/>
<input type="text" id="txt1" class="ui-datepicker-trigger" value="textbox 1"></input>
<img class="ui-datepicker-trigger" src="calendar.jpg" alt="..." title="..." style="display: inline;">
</body>
</html>