Событие onClick - JavaScript - Ответ 12235726

@carl3133 · Регистрация: 22.11.2015

Студворк — интернет-сервис помощи студентам

Передо мной стоит задача, суть которой заключается в том, чтобы при нажатии на ссылку в левом столбце - в правом столбце должно появится расписание. Как сделать появление фотографии, я могу, а вот как добавить в правый столбец по нажатию на ссылку текст - не знаю
Помогите разобраться с этим

HTML5

<html>
<head>
    <title>Расписание</title>
    <meta charset="utf-8" />
    <link rel="stylesheet" href="style.css" type="text/css">
    <script src="script.js"></script>
</head>
<body>
    <table class="table">
        <tr>
            <th>
                Дни недели
            </th>
            <th>
                Расписание
            </th>
        </tr>
        <tr>
            <td>
                <a href="#" onclick="ChangeImage('1.1')">Понедельник</a>
            </td>
            <td rowspan="5">
                <img id="foto" src="2.png">
            </td>
        </tr>
        <tr>
            <td>
                <a href="#" onclick="ChangeImage('1.2')">Вторник</a>
            </td>
        </tr>
        <tr>
            <td>
                <a href="#" onclick="ChangeImage('1.3')">Среда</a>
            </td>
        </tr>
        <tr>
            <td>
                <a href="#" onclick="ChangeImage('1.4')">Пятница</a>
            </td>
        </tr>
        <tr>
            <td>
                <a href="#" onclick="ChangeImage('1.5')">Суббота</a>
            </td>
        </tr>
    </table>
</body>
</html>

Javascript

function ChangeImage(photo_name)
{
    document.getElementById('foto').src = photo_name + ".png";
}

CSS

table,tr,th,td {
    border: 2px solid black;
    border-collapse: collapse;
    width: 450px;
    margin-left: 350px;
    margin-top: 200px;
}
td {
    padding-left: 10px;
    padding-right: 10px;
}
a{
    text-decoration: none;
    color: blue;
}
a:hover{
    color:red;
}
img {
    width: 550px;
    height: 300px;
    border: white;
}
.table {
    height: 300px;
}

Вернуться к обсуждению:
Событие onClick JavaScript

Следующий ответ

Другие темы раздела
JavaScript Как можно передать заголовки? https://www.cyberforum.ru/ javascript-beginners/ thread2214511.html Всем привет! В процессе работы парсера на PHP рождается массив с кодировкой UTF-8, который моделькой упаковывается в txt файл через file_put_contents(), кладется в папочку на сервере, а адрес к...	Передача переменной,содержащей путь в src картинки JavaScript Это функция предварительного просмотра и вывода его на стр через table function preview() { var name = document.getElementById('name').value; var email =...
JavaScript Блокровка элемента после перезагрузки javascript https://www.cyberforum.ru/ javascript-beginners/ thread2214167.html Подскажите, пожалуйста, как после перезагрузки встроенного фрейма заблокировать select и textarea от редактирования? <form> <div class="pricing-action"><p><h5><font...	JavaScript Аналог goto в js Есть ли аналог goto,как,например,в С++, в JavaScript? https://www.cyberforum.ru/ javascript-beginners/ thread2214134.html
Как привязать анимацию к прокрутке страницы JavaScript Подскажите как привязать анимацию к отступу сверху или снизу экрана, что бы анимация срабатывала при прокрутке? На каждый вопрос создавайте по одной теме! (Правила п.4.4)	JavaScript Отобразить весь список Есть сайт (vk.city4me.com/user_time_online.php?id=425011983) не реклама, сайт не мой, на нём расположен список, навигация по списку через календарь. То есть нужно ставить дату, выдается список. Мне... https://www.cyberforum.ru/ javascript-beginners/ thread2214006.html
JavaScript Найти количество цифр "3" и "5" в числе https://www.cyberforum.ru/ javascript-beginners/ thread2213987.html Найти количество цифр "3" и "5" в числе JavaScript	Даны три числа. Найти наименьшее из них JavaScript Даны три числа. Найти наименьшее из них., , Чтобы числа самому вводить <html> <head> <script> var a = 1; var b = 21;
JavaScript Где ошибка javascript https://www.cyberforum.ru/ javascript-beginners/ thread2213813.html var x = 3; do { document.writeln(x); x + 3; } while (x < 100); все начинает грузится и ничего не происходит	JavaScript Поиск заданного текста в HTML коде Добрый день, уважаемые форумчане. не буду вдаваться в подробности, скажу лишь одно, с Явой знаком крайне мало. По работе возник вопрос в реализации следующего скрипта: в открытой в браузере... https://www.cyberforum.ru/ javascript-beginners/ thread2213790.html
Блокировка формы после выбора элемента JavaScript Добрый день. Подскажите, пожалуйста, как в этом коде сделать так, чтобы после выбора одного из элементов (option value), введенный пользователем текст (textarea) заблокировался от редактирования. ...	JavaScript Поиск совпадений в строке на просом примере уважаемые, нашёл пример console.log(/cat/.test("concatenate")); ни как не могу прикрутить переменные к нему let text = 'asdasdsdfasdfdas' let pattern = '/sdf/' https://www.cyberforum.ru/ javascript-beginners/ thread2213736.html