X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость (

| Вход | Регистрация )

Открыть тему
Тема закрыта
> Хочу чтобы при выборе чекбокса снизу печаталось сообщение, а не на новой странице
IvanovIvan
IvanovIvan
Topic Starter сообщение 9.12.2010, 13:51; Ответить: IvanovIvan
Сообщение #1


[JS]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<script language="JavaScript"><!--

function q1() {
document.write('<FONT COLOR="RED">'+'выбран красный'+'</FONT>');
}

function q2() {
document.write('<FONT COLOR="BLUE">'+'выбран синий'+'</FONT>');
}

function q3() {
document.write('<FONT COLOR="GREEN">'+'выбран зеленый'+'</FONT>');
}

// --></script>
</head>
<body>
<form name='form1'>
<input type='checkbox' name='c2' onClick='q1()'>RED <BR>
<input type='checkbox' name='c2' onClick='q2()'>BLUE <BR>
<input type='checkbox' name='c3' onClick='q3()'>GREEN <BR>
</form>
</body>
</html>
[/JS]

Т.е. я выбираю чекбокс с именем с1 и вызывается функция q1() которая печатает "выбран красный". Я хочу чтобы это печаталось под чекбоксами на этой же странице. Помогите., плс
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Albatros
Albatros
сообщение 9.12.2010, 14:15; Ответить: Albatros
Сообщение #2


Можно так:

[JS]<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<script language="JavaScript"><!--

function q1() {
document.getElementById('label').innerHTML ='<FONT COLOR="RED">'+'выбран красный'+'</FONT>';
}

function q2() {
document.getElementById('label').innerHTML ='<FONT COLOR="BLUE">'+'выбран синий'+'</FONT>';
}

function q3() {
document.getElementById('label').innerHTML ='<FONT COLOR="GREEN">'+'выбран зеленый'+'</FONT>';
}

// --></script>
</head>
<body>
<form name='form1'>
<input type='checkbox' name='c2' onClick='q1()'>RED
<input type='checkbox' name='c2' onClick='q2()'>BLUE
<input type='checkbox' name='c3' onClick='q3()'>GREEN
</form>
<div id="label"></div>

</body>
</html>
[/JS]
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
IvanovIvan
IvanovIvan
Topic Starter сообщение 9.12.2010, 14:20; Ответить: IvanovIvan
Сообщение #3


Спасибо, с "getElementById" я еще пока не знаком, буду разбираться
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Letmetouchyou
Letmetouchyou
сообщение 9.12.2010, 16:31; Ответить: Letmetouchyou
Сообщение #4


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">

<style type='text/css'>
        * {margin:0; padding:0;}
        div.block {border:1px solid #444; width:200px; float:left; margin:0 10px; padding:5px}
</style>

</head>
<body>
  
    <div class='block'>
     <input type='checkbox' name='red'>RED    
     <p></p>
    </div>
    
    <div class='block'>
     <input type='checkbox' name='blue'>BLUE  
     <p></p>
    </div>
    
    <div class='block'>
     <input type='checkbox' name='green'>GREEN
     <p></p>
    </div>
  
    <script type="text/javascript">
    var data = {
    
        red:{
            text:'Выбран красный',
            color:'#cc0000'
            },
        blue:{
            text:'Выбран синий',
            color:'#3399ff'
            },
        green:{
            text:'Выбран зеленый',
            color:'#009900'
            }
    
    };
    
    function onChange(e){
    
        var name = this.name;
        var p = this.parentNode.getElementsByTagName('p')[0];
        if(this.checked){
        
        
            p.style.color = data[name].color;
            p.innerHTML = data[name].text;
            
            } else {
            
            p.innerHTML = '';
            
            }
        
    }
        var boxes = document.getElementsByClassName('block');
        var checkboxes = [];
        for(var i = 0; i<boxes.length; i++){
        
            var element = boxes[i].getElementsByTagName('input');
            checkboxes.push(element);
            
            element[0].addEventListener('change',onChange,false);
                        
        
        }
        
        


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


Замечание модератора:
Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней.
Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой
или обратитесь к любому из модераторов.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
« Предыдущая тема · Программная часть · Следующая тема »
 
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) Нужен кодер, чтобы пофиксить ошибку Wordpress после переноса сайта
 0 Alex-777 926 7.4.2024, 18:05
автор: Alex-777
Открытая тема (нет новых ответов) Мегамаркет. Скидка 1000 рублей при покупке от 5000 рублей на все, на первый заказ.
Мегамаркет. Скидка 1000 рублей при покупке от 5000 рублей на все, на п
 7 stu999 1756 31.3.2024, 11:19
автор: stu999
Открытая тема (нет новых ответов) Apple пойдет на сотрудничество с конкурентами, чтобы выбиться в лидеры с ИИ
 4 Room 1230 31.3.2024, 1:15
автор: Liudmila
Открытая тема (нет новых ответов) SEO-текст на главной странице сайта и в категориях
 5 boltuk 1429 26.3.2024, 21:43
автор: c4p1t4l15t
Открытая тема (нет новых ответов) Как составить уравнение, чтобы назначить цену для товара?
 2 rownong27 761 21.3.2024, 12:53
автор: Lumex


 

Режим отображения: Стандартный · Переключить на: Линейный · Переключить на: Древовидный

Подписка на тему · Сообщить другу · Версия для печати · Подписка на этот форум

RSS Текстовая версия Сейчас: 24.4.2024, 3:59

Дизайн

 
Форум IP.Board © 2024  IPS, Inc.
Лицензия зарегистрирована на: MaulNet
Jooble
Форум IP.Board © IPS, Inc.
Лицензия зарегистрирована на: MaulNet