Javascript.RU

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

Изменение цвета шрифта выбранного значения select
Добрый день! Есть

<select>
<option value="">Select with few options</option>
<option value="apple">Apple</option>
<option value="banana">Banana</option>
<option value="orange">Orange</option>
</select>

Подскажите функцию, которая будет изменять цвет шрифта выбранного значения select
Ответить с цитированием
  #2 (permalink)  
Старый 18.07.2014, 15:33
Профессор
Отправить личное сообщение для skrudjmakdak Посмотреть профиль Найти все сообщения от skrudjmakdak
 
Регистрация: 27.04.2012
Сообщений: 1,410

а сами на js что либо писали(пытались реализовать)?
Ответить с цитированием
  #3 (permalink)  
Старый 18.07.2014, 15:45
Профессор
Отправить личное сообщение для Rise Посмотреть профиль Найти все сообщения от Rise
 
Регистрация: 07.11.2013
Сообщений: 4,662

Сообщение от AlexG88 Посмотреть сообщение
Подскажите функцию, которая будет изменять цвет шрифта выбранного значения select
Где изменять?
Ответить с цитированием
  #4 (permalink)  
Старый 18.07.2014, 16:55
Интересующийся
Отправить личное сообщение для AlexG88 Посмотреть профиль Найти все сообщения от AlexG88
 
Регистрация: 18.07.2014
Сообщений: 12

Есть select, при нажатии выпадает список. Нужно как то после того как выбрал что то из списка, стало выбранным в селекте другим цветом шрифта
Ответить с цитированием
  #5 (permalink)  
Старый 18.07.2014, 16:58
Профессор
Отправить личное сообщение для skrudjmakdak Посмотреть профиль Найти все сообщения от skrudjmakdak
 
Регистрация: 27.04.2012
Сообщений: 1,410

покажите что есть на js?
Ответить с цитированием
  #6 (permalink)  
Старый 18.07.2014, 17:51
Профессор
Отправить личное сообщение для Rise Посмотреть профиль Найти все сообщения от Rise
 
Регистрация: 07.11.2013
Сообщений: 4,662

<style>
.default{color:black}
.apple{color:red}
.banana{color:yellow}
.orange{color:orange}
</style>

<select class="default" onchange="this.className=this.value">
    <option class="default" value="default">Select with few options</option>
    <option class="apple" value="apple">Apple</option>
    <option class="banana" value="banana">Banana</option>
    <option class="orange" value="orange">Orange</option>
</select>
Ответить с цитированием
  #7 (permalink)  
Старый 18.07.2014, 19:41
Интересующийся
Отправить личное сообщение для AlexG88 Посмотреть профиль Найти все сообщения от AlexG88
 
Регистрация: 18.07.2014
Сообщений: 12

<select id="sel" name="sel">
<option value="0">zero</option>
<option value="1">one</option>
<option value="2">two</option>
<option value="3">three</option>
</select>

<script>
$(function() {
$('#sel :selected').css('color', 'red');
});
</script>

Но этот вариант не работает именно так как я хочу. Нужно что бы только выбранный вариант из списка становился красным, когда уже он выбран и список свернут
Ответить с цитированием
  #8 (permalink)  
Старый 18.07.2014, 21:39
Профессор
Отправить личное сообщение для skrudjmakdak Посмотреть профиль Найти все сообщения от skrudjmakdak
 
Регистрация: 27.04.2012
Сообщений: 1,410

оно?
<html>
	<head>
		<title>example</title>
	</head>
	<body>
<select class="default">
    <option value="default">Select with few options</option>
    <option value="apple">Apple</option>
    <option value="banana">Banana</option>
    <option value="orange">Orange</option>
</select>
		<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>

 <script>
var newValue;
$('select').change(function ()
	{
	if (newValue)
		newValue.css('color', 'black');
		
	newValue = $(this).find(':selected');
	newValue.css('color', 'red');
	});
 </script>
	</body>
</html>
Ответить с цитированием
  #9 (permalink)  
Старый 18.07.2014, 22:27
Профессор
Отправить личное сообщение для Rise Посмотреть профиль Найти все сообщения от Rise
 
Регистрация: 07.11.2013
Сообщений: 4,662

без jquery
<select id="sel">
    <option value="0">zero</option>
    <option value="1">one</option>
    <option value="2">two</option>
    <option value="3">three</option>
</select>

<script>
document.getElementById("sel").onchange = function(){
    if (this.prev) this.prev.style.color = "black";
    this.prev = this.options[this.selectedIndex];
    this.prev.style.color = "red";
}
</script>
Ответить с цитированием
  #10 (permalink)  
Старый 18.07.2014, 23:16
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,067



Сообщение от AlexG88
Нужно что бы только выбранный вариант из списка становился красным, когда уже он выбран и список свернут
моя понял так )))

<!DOCTYPE HTML>
<html>
	<head>
		<title>example</title>
        <meta charset="utf-8">
	</head>
	<body>
<select class="default">
    <option value="default">Select with few options</option>
    <option value="apple">Apple</option>
    <option value="banana">Banana</option>
    <option value="orange">Orange</option>
</select>
		<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>

 <script>
 $('select').change(function () {
     var i = this.selectedIndex;
     $(this).css('color', i ? 'red' : '');
     $('option', this).css('color', 'black').eq(i).css('color', i ? 'red' : 'black');
 });
 </script>
	</body>
</html>
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
изменение значения input при смене значения select galart jQuery 4 30.01.2015 19:39
Скрыть/показать элементы в зависимости от значения select AnyKeyLeft Элементы интерфейса 12 16.07.2014 16:26
Как сделать на сайте выбор шрифта пользователем и динамическое изменение введенного т angelzzz Events/DOM/Window 4 17.02.2014 05:59
Изменение шрифта у селектора и его потомков vitaliy43 Общие вопросы Javascript 2 03.12.2013 12:11
Как реализована изменение цвета фотографии? progress0477 jQuery 0 17.09.2012 17:17