Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Изменение текстов при клике (https://javascript.ru/forum/dom-window/8838-izmenenie-tekstov-pri-klike.html)

insomnia 15.04.2010 17:51

Изменение текстов при клике
 
Извините, если повторяюсь, но подобного вопроса не нашла.

Я написала скрипт, но уж очень он огромный и неудобный. Уверена, что можно сократить. Подскажите, пожалуйста.

Есть ссылки, при клике на которые открывается текст, меняется цвет шрифта активной ссылки, и также происходит с остальными. Один текст открывается, остальные закрываются

Вот, что у меня получилось

<a href="javascript:void()" id="l1" style="color:red;" onclick="ChangeText1">Ссылка 1</a>
<a href="javascript:void()" id="l2" onclick="ChangeText2">Ссылка 2</a>
<a href="javascript:void()" id="l3" onclick="ChangeText3">Ссылка 3</a>

<div class="text1" id="t1">Текст 1</div>
<div class="text1" id="t1" style="display:none;">Текст 2</div>
<div class="text1" id="t1" style="display:none;">Текст 3</div>

function ChangeText1(){
document.getElementById("l1").style.color = "#de1800";
document.getElementById("l2").style.color = "#5a5d60";
document.getElementById("l3").style.color = "#5a5d60";

document.getElementById("text1").style.display = "";
document.getElementById("text2").style.display = "none";
document.getElementById("text3").style.display = "none";
}

function ChangeText2(){
document.getElementById("l2").style.color = "#de1800";
document.getElementById("l1").style.color = "#5a5d60";
document.getElementById("l3").style.color = "#5a5d60";

document.getElementById("text1").style.display = "none";
document.getElementById("text2").style.display = "";
document.getElementById("text3").style.display = "none";
}

И также для 3й сслыки, а у меня их 10

Gvozd 15.04.2010 17:58

используйте циклы, условия, и передачу объекта this в ф-цию обработчик события

insomnia 15.04.2010 18:05

А могли бы вы привести пример. Я не сильна в JavaScript просто ...

Gvozd 15.04.2010 18:11

Здравствуйте!

Судя по вашему сообщению, вы ну совсем не знаете javascript.

Освойте основы языка и вопрос отпадет сам, полностью или частично.
А с чем не справитесь - поможем.

На сайте javascript можно начать изучать с учебника, раздел Основы javascript.
Возможно, вам также понадобится HTML - учебник есть, например, здесь: http://ru.html.net/tutorials/html/

Задавайте конкретные вопросы по ходу дела.

insomnia 15.04.2010 18:35

Спасибо. html знаю. Изучать надо, конечно. Но хотелось бы получить ответ на конкретный пример. Я ведь скрипт худо-бедно написала, который работает. Есть такие разделы, где такие вопросы задавать можно вообще?

Gvozd 15.04.2010 18:43

цикл
условие
операторы сравнения(нужен ===)
пример передачи объекта вызвавшего событие
<a href="#" onclick="func(this);">qwe</a>
<a href="#" onclick="func(this);">asd</a>

function func(obj){
alert(obj.innerHTML)
}

в цункции-обработчике переберите циклом все возможные id-шники, и поменяйте стили для элементов не совпадающих с объектом вызвавшим событие на один стиль, а для вызвавшего на другой стиаль

insomnia 15.04.2010 18:50

спасибо. буду разбираться


Часовой пояс GMT +3, время: 17:04.