Форум

Zhyhana · #1 (**permalink**) 17.11.2015, 19:15

Доброго времени суток!
Есть форма:

<form action="#" name="user-form" class="form">
	<div class="wrapper_input">
		<input type="text" class="input" id="company_name" name="company_name" placeholder="Компания" />
	</div>
	<div class="wrapper_input">
		<input type="text" class="input" id="user_name" name="user_name" placeholder="Контактное лицо*" required/>
	</div>
	<div class="wrapper_input">
		<input type="tel" class="input" id="tel"e name="tel" placeholder="Телефон*" required/>
	</div>
	<div class="wrapper_input">
		<input type="mail" class="input" id="email"e name="email" placeholder="E-mail*" required />
	</div>
	<div class="wrapper_submit">
		<input class="submit" type="submit" value="Отправить"/>
	</div>
</form>

Нужно проверить что input не пуст. И в случае, если был введен текст добавить input'у класс.
Должно работать для ВСЕХ input'ов!!!

Mess4me · #2 (**permalink**) 17.11.2015, 19:47

Zhyhana,
так?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
    <title>Быстрый переход внутри документа</title>
</head>
<body>


<form action="#" name="user-form" class="form">
    <div class="wrapper_input">
        <input type="text" class="input" id="company_name" name="company_name" placeholder="Компания" />
    </div>
    <div class="wrapper_input">
        <input type="text" class="input" id="user_name" name="user_name" placeholder="Контактное лицо*" required/>
    </div>
    <div class="wrapper_input">
        <input type="tel" class="input" id="tel"e name="tel" placeholder="Телефон*" required/>
    </div>
    <div class="wrapper_input">
        <input type="mail" class="input" id="email"e name="email" placeholder="E-mail*" required />
    </div>
    <div class="wrapper_submit">
        <input class="submit" type="submit" value="Отправить"/>
    </div>
</form>


<script>

    $('input:submit').click(function () {
        $('input').each(function (i, input) {
            if(!input.value.length) return;
            $(input).addClass('newClass')
        })

    })

</script>
 
</body>
</html>

laimas · #3 (**permalink**) 17.11.2015, 20:46

http://htmlbook.ru/css/invalid

Григорий Данилович · #4 (**permalink**) 17.11.2015, 21:15

$('input').on('change', function () {if ($(this).val()!='') $(this).attr('class','classSomethingIn');});

Я не проверял и набросал черновой вариант, как бы я начал искать решение проблемы.

Форум

Справочник

Discord чат

Курсы javascript