как присвоить параметр disabled к граф. кнопке

Статус
В этой теме нельзя размещать новые ответы.
N

niv

Постоялец
Регистрация
25 Апр 2010
Сообщения
57
Реакции
4
помогите пож-та с кодом.
1. состояние по умолчанию:
страница открыта на ней картинка - DotSH-Bullet-Smile.png
и checkbox. Флаг в checkbox не стоит и
элемент (сама картинка DotSH-Bullet-Smile.png) неактивная.
2. состояние
- поставили флаг в checkbox
картинка изменилась на smile.png и элемент (картинка smile.png) стал активным.
PHP: 
<script type="text/javascript">
function test(f) {
    if (f.testCh.checked) document.getElementById('testSubm').src = 'smile.png';
    else document.getElementById('testSubm').src = 'DotSH-Bullet-Smile.png';
}
</script>
<form action="linc.php" method="get">
    <input type="checkbox" id="testCh" name="testCh" onclick="test(this.form);" />
    <input type="image" id="testSubm" name="testSubm" src="DotSH-Bullet-Smile.png" disabled="disabled"/>
</form>
остаётся прикрутить к кнопке параметр - disabled, но вот как?
вставил disabled="disabled"... ничего не получается :(.
 
попробуйте от input type=image для кнопки перейти к родному submit.

PHP: 
<input type="submit" alt="Искать" class="find" value="" id="testSubm">

.find {
background:url("find.gif") repeat scroll 0 0 transparent;
height:100px;
width:20px;
}
 
Вы меня извините, но я не понял как это увязать с имеющимся кодом. Т.е. - .find вставить в скрипт?
Но откуда find.gif ?

Если не сложно, дайте пож-та готовое решение.
 
вот готовое решение, кроме мозиллы проверял в шестом осле - все пашет, только что-то при загрузке не хочет фон на кнопку ставится, пришлось насильно ставить :)
HTML: 
<html>
<head>
	<title>test_img_form</title>
	<style type="text/css">
		#testSubm {
		background:url("find.gif") repeat scroll 0 0 transparent;
		width:75px;
		height:20px;
		}
	</style>
	<script type="text/javascript">
		function intervOnLoad(){
			tmId=setInterval("chekhIsId(tmId)",25);
		}
		function chekhIsId(timIdVar){
			if(document.getElementById('testSubm')){
				document.getElementById('testSubm').style.backgroundImage = 'url(DotSH-Bullet-Smile.png)';
				clearInterval(timIdVar);
			}
		}
		function test(f){
			if(f.checked){
				document.getElementById('testSubm').disabled = '';
				document.getElementById('testSubm').style.backgroundImage = 'url(smile.png)';
			}
			else{
				document.getElementById('testSubm').disabled = "disabled";
				document.getElementById('testSubm').style.backgroundImage = 'url(DotSH-Bullet-Smile.png)';
			}
		}
		intervOnLoad()
	</script>
</head><body>
<form action="/" method="get">
	<input type="checkbox" id="testCh" name="testCh" onclick="test(this);" />
	<input type="submit" alt="Искать" value="" id="testSubm" disabled="disabled" />
</form>
</body></html>
 
  • Нравится
Реакции: niv
большое спасибо!
Но ведь это решение со стилями (натягивая картинку на кнопку).
А с заменой картинок такое нельзя реализовать?
нечто похожее увидел здесь:
Для просмотра скрытого содержимого вы должны войти или зарегистрироваться.


только чтобы увидеть как работает, нужно товар добавить и зайти в корзину. Если в поле изменить количество, картинка - "персчитать" меняется с серой на зелёную и становится активной.
 
PHP: 
function CartCalc() {
144 var prod_counts=new Array();
145 var cartChange=false;
146 var totalPrice=0;
147 $(".prod_count").each(function(i){
148 var tid=parseInt((this.id).replace('cartcnt_',''));
149 prod_counts[tid]=this.value;
150 if(cartOrigin[tid]!=parseInt(this.value)) {
151 cartChange=true;
152 }
153 $('#cartPrice_'+tid).text(cartOriginPr[tid]*prod_counts[tid]);
154 totalPrice+=cartOriginPr[tid]*prod_counts[tid];
155 });
156 totalOrderPrice=totalPrice;
157 $('#carttotalprice').text(totalOrderPrice+parseInt($('#cartdelivprice').text()));
158 if(cartChange){
159 $('#order').attr("disabled","true");
160 $('#order').attr("src","/i/buttons/disorder.gif");
161 $('#cartconfirm').removeAttr("disabled");
162 $('#cartconfirm').attr("src","/i/buttons/recount.gif");
163 } else {
164 $('#cartconfirm').attr("disabled","true");
165 $('#cartconfirm').attr("src","/i/buttons/disrecount.gif");
166 $('#order').removeAttr("disabled");
167 $('#order').attr("src","/i/buttons/order.gif");
168 }
169}

вот код который вы ищете. обратите внимание как у них определяется "активность" кнопки;-)
 
да эту функцию я видел, но поскольку слаб в програмировании, никак не могу понять как выбросить всё лишнее из этой функции и реализовать задуманное :(
 
А с заменой картинок такое нельзя реализовать?
Нажмите для раскрытия...

Конечно, можно - но вот зачем тогда добавлять disable к граф. кнопке? Достаточно того, что первая картинка будет в серых тонах...

HTML: 
<html>
<head>
	<title>test_img_form</title>
	<script type="text/javascript">
		function gID(i){return document.getElementById(i);}
		function f_chk(){
			if(gID('testChek').checked){
				gID('testSubm').style.cursor = 'pointer';
				gID('testSubm').src = 'smile.png';
			}
			else{
				gID('testSubm').style.cursor = 'default';
				gID('testSubm').src = 'DotSH-Bullet-Smile.png';
			}
		}
		function f_clk(){
			if(gID('testChek').checked){
				gID('testChek').checked='';
				gID('testSubm').src = 'DotSH-Bullet-Smile.png';
				gID('testForm').submit();
			}
		}
	</script>
</head><body>
<form action="/" method="get" id="testForm">
	<input type="text" id="testNum" name="testNum" value="100500" style="width:55px" />
	<input type="checkbox" id="testChek" name="testChek" onclick="f_chk();" />
	<a href="#" style="cursor:default" onclick="f_clk();return false;">
		<img id="testSubm" src="DotSH-Bullet-Smile.png" border="0" />
	</a>
</form>
</body></html>

Здесь присутствует эффект с курсором, но не уверен, что это будет работать в некоторых браузерах(например в Safari).
 
  • Нравится
Реакции: niv
steel_HILL, СПАСИБО!
только в форме оставил
PHP: 
<form action="/" method="get" id="testForm">

	<input type="checkbox" id="testChek" name="testChek" onclick="f_chk();" />
	<a href="#" style="cursor:default" onclick="f_clk();return false;">
		<img id="testSubm" src="DotSH-Bullet-Smile.png" border="0" />
	</a>

</form>
Вроде всё работает как надо.
 
Статус
В этой теме нельзя размещать новые ответы.
Назад
Сверху