Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 28.11.2010, 15:44
Интересующийся
Отправить личное сообщение для InetBUG Посмотреть профиль Найти все сообщения от InetBUG
 
Регистрация: 28.11.2010
Сообщений: 14

Активная\Не активная кнопка
Есть два элемента, куда вводится заголовок (input) и текст (textarea). Сначала они пусты, поэтому submit - disabled.

Нужно сделать так, чтобы когда эти !оба! поля были заполнены (т.е. не были пусты - имели хотя бы по одному символу), то disabled с submit убирался бы. Но если !хотя бы одно! из этих полей опять становится пустым (ну, т.е. пользователь стирает информацию в нём), то submit снова становится disabled.

Написал вот такое:

var title = $('input[name="title"]');
var content = $('textarea[name="content"]');
var submit = $('.editor :submit');
$('input[name="title"], textarea[name="content"]').keypress( function() {
	if (title.val()!='' && content.val()!='') { submit.removeAttr('disabled'); }
	if (title.val()=='' || content.val()=='') { submit.attr({disabled: 'disabled'}); }
});


Но этот код выполняет только первую часть: когда оба поля заполняются, disabled с submit снимается. А вот если очистить одно поля или даже оба, то disabled на submit не ставится. Что не так?

Последний раз редактировалось InetBUG, 28.11.2010 в 15:47.
Ответить с цитированием
  #2 (permalink)  
Старый 28.11.2010, 15:56
Профессор
Отправить личное сообщение для exec Посмотреть профиль Найти все сообщения от exec
 
Регистрация: 21.01.2010
Сообщений: 1,022

Проверяйте по keyup вместо keypress.
Ответить с цитированием
  #3 (permalink)  
Старый 28.11.2010, 17:09
Особый гость
Посмотреть профиль Найти все сообщения от monolithed
 
Регистрация: 02.04.2010
Сообщений: 4,260

Как вариант, без использования disabled

<style>
.invalidate {color:red;}
.validate {color: green;}
</style>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<p>Введите корректные данные</p>
<form action="#">
      <input type="text" />
      <input type="submit" />
</form>
<div></div>
<script>
$("form").submit(function() {
    if (/\d+/.test($("input:first").val())) {
        $("div").text("Правильно...").addClass('validate').show();
        return true;
   }
   $("div").text("Неправильно: только цифры").removeClass('validate').addClass('invalidate').show().fadeOut(1000);
      return false;
   });
</script>
Ответить с цитированием
  #4 (permalink)  
Старый 22.06.2012, 04:12
Профессор
Отправить личное сообщение для lamer Посмотреть профиль Найти все сообщения от lamer
 
Регистрация: 08.02.2012
Сообщений: 216

Уважаемые пожалуйста покажите как этот скрипт будет выглядеть на JS, а не на JQ.
JQ вообще не понимаю.

Или такое затухание не возможно сделать на JS ?
Ответить с цитированием
  #5 (permalink)  
Старый 22.06.2012, 04:44
Аватар для Aetae
Любитель
Отправить личное сообщение для Aetae Посмотреть профиль Найти все сообщения от Aetae
 
Регистрация: 02.01.2010
Сообщений: 5,404

Jq сделано на js, соответственно всё что сделано на jq - сделано на js.
Открываешь код jq и смотришь как там сделано fadeOut.
__________________
29375, 35

Последний раз редактировалось Aetae, 22.06.2012 в 04:46.
Ответить с цитированием
  #6 (permalink)  
Старый 22.06.2012, 05:31
Профессор
Отправить личное сообщение для lamer Посмотреть профиль Найти все сообщения от lamer
 
Регистрация: 08.02.2012
Сообщений: 216

Сообщение от Aetae Посмотреть сообщение
Jq сделано на js, соответственно всё что сделано на jq - сделано на js.
Открываешь код jq и смотришь как там сделано fadeOut.
Спасибо.
Открыл я линк http://code.jquery.com/jquery-latest.min.js
И fadeOut там такой:
fadeOut: {
      opacity: "hide"
    }


Или где смотреть то нужно ?
Ответить с цитированием
  #7 (permalink)  
Старый 22.06.2012, 05:46
Аватар для Aetae
Любитель
Отправить личное сообщение для Aetae Посмотреть профиль Найти все сообщения от Aetae
 
Регистрация: 02.01.2010
Сообщений: 5,404

Ну во-первых: http://code.jquery.com/jquery-latest.js
Во вторых, надо разобрать весь код и выяснить зависимости, что куда идёт и что делает.

Или же просто погуглить, ключевые слова "javascript fade in out".
В любом случае, если понимаете, что такой вопрос мог задаваться до вас(Чтобы это понять надо лишь слегка пораскинуть мозгами.) - используйте гугл. В принципе даже если думаете что ваш вопрос точно уникален - всё равно попробуйте погуглить, ибо всё равно остаётся шанс.
Спрашивать же такие банальности на форумах моветон. Да и ответчать на такие вопросы - скука, а потому ответа вы можете недождаться вообще.
__________________
29375, 35
Ответить с цитированием
  #8 (permalink)  
Старый 22.06.2012, 06:53
что-то знаю
Отправить личное сообщение для devote Посмотреть профиль Найти все сообщения от devote
 
Регистрация: 24.05.2009
Сообщений: 5,176

lamer,
http://learn.javascript.ru/animation
__________________
хм Russians say завтра but завтра doesn't mean "tomorrow" it just means "not today."
HTML5 history API рассширение для браузеров не поддерживающих pushState, replaceState
QSA CSS3 Selector Engine
Ответить с цитированием
  #9 (permalink)  
Старый 23.06.2012, 11:20
Профессор
Отправить личное сообщение для lamer Посмотреть профиль Найти все сообщения от lamer
 
Регистрация: 08.02.2012
Сообщений: 216

Нашел вариант но с рисунком, с текстом такое же не получается:
<div id="imgId">Test</div>

Подскажите плиз как переделать под текст ?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="content-type" content="text/html; charset=utf-8" />
	<title>Анимация: Fade Id - Fade Out</title>
	<script type="text/javascript">
	//<![CDATA[
var fade = { // Namespace
	ids	: {},
	step	: 0.05,
	delay	: 20, // ms
	timer	: null,
	setOpacity : function(elem, nOpacity) {
		if (typeof elem == 'string') elem = document.getElementById(elem);
		var props = ['MozOpacity', 'KhtmlOpacity', 'opacity'];
		for (var i in props) {
			if (typeof elem.style[props[i]] == 'string') {
				elem.style[props[i]] = nOpacity;
				return;
			}
		}
		// IE 6+
		try {
			nOpacity = 100 * parseFloat(nOpacity);
			if ((oAlpha = elem.filters['DXImageTransform.Microsoft.alpha'] || elem.filters.alpha)) oAlpha.opacity = nOpacity;
			else elem.style.filter += "progid:DXImageTransform.Microsoft.Alpha(opacity="+nOpacity+");";
		} catch (e) {
			// IE <= 5.5 OR Opera < 9 OR another browser. Do nothing
		}
	},
	_out : function(id, from, to, callback) {
		from -= this.step;
		from = from <= to ? to : from;
		if (this.doit(id, from, to, callback)) 
			this.timer = setTimeout("fade._out('"+id+"', "+from+", "+to+", '"+(callback ? callback : '')+"')", this.delay);
	},
	_in : function(id, from, to, callback) {
		from += this.step;
		from = from >= to ? to : from;
		if (this.doit(id, from, to, callback)) 
			this.timer = setTimeout("fade._in('"+id+"', "+from+", "+to+", '"+(callback ? callback : '')+"')", this.delay);
	},
	doit : function(id, from, to, callback) {
		this.setOpacity(id, from);
		clearTimeout(this.timer);
		if (from == to) {
			if (callback) eval(callback+'()');
		} else return true;
	}
}
	// Колбэки
	function stopHide() {//Вернуть лого фасткодера
	var button_in = document.getElementById('button_in');
		button_in.onclick = function() {
			fade._in('imgId', 0, 1, 'showHide');
		}
	}
	function showHide() {//Вернуть лого фасткодера
	var button_out = document.getElementById('button_out');
		button_out.onclick = function() {
			fade._out('imgId', 1, 0, 'stopHide');
		}
	}
	//]]>
	</script>
</head>
<body>	
	<h2>Нажмите на кнопку</h2>
	<p><img id="imgId" src="http://upload.wikimedia.org/wikipedia/commons/thumb/6/6a/JavaScript-logo.png/200px-JavaScript-logo.png" width="134" height="68" alt="" /></p>	
	<p><input id="button_out" type="button" value="Убрать лого фасткодера" onclick="fade._out('imgId', 1, 0, 'stopHide');" /></p>
	<p><input id="button_in" type="button" value="Вернуть лого фасткодера" onclick="fade._in('imgId', 0, 1, 'showHide');" /></p>
</body>
</html>
Ответить с цитированием
  #10 (permalink)  
Старый 23.06.2012, 14:51
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,220

lamer,
Помогите решить задачку.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Кнопка onclick=javascript:location в новом окне Nikola Общие вопросы Javascript 7 13.11.2010 10:16
Зажимающаяся кнопка Darth Padla Элементы интерфейса 5 21.06.2010 09:01
Кнопка сохранить в файл mff Events/DOM/Window 14 26.05.2010 13:21
Активная кнопка F_A Элементы интерфейса 7 26.02.2010 13:52
Не работает кнопка "Назад" savagden Javascript под браузер 3 10.12.2009 19:25