Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #11 (permalink)  
Старый 16.01.2021, 02:50
Аспирант
Отправить личное сообщение для Konstantin47 Посмотреть профиль Найти все сообщения от Konstantin47
 
Регистрация: 12.01.2021
Сообщений: 32

как цитата - [name='elems']{
03
display: none;
(с) это получается классы в css оформлены? пытаюсь тему найти

Я извиняюсь конечно за много вопросов, просто хочу разобраться ( про вместо alert - "open" я бы и не догадался пока, что - все попытки были через alert, как это делать и даже сейчас, почему у меня не работает, то вот
Ответить с цитированием
  #12 (permalink)  
Старый 16.01.2021, 08:49
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Сообщение от Konstantin47
пытаюсь тему найти
??? https://developer.mozilla.org/ru/docs/Web/CSS/Reference
Ответить с цитированием
  #13 (permalink)  
Старый 16.01.2021, 14:32
Аспирант
Отправить личное сообщение для Konstantin47 Посмотреть профиль Найти все сообщения от Konstantin47
 
Регистрация: 12.01.2021
Сообщений: 32

стили в css я понимаю, меня это удивило, что начинается с [ ] , а не с #

Спасибо большое
Ответить с цитированием
  #14 (permalink)  
Старый 16.01.2021, 15:38
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Konstantin47,
https://developer.mozilla.org/ru/doc...bute_selectors
Ответить с цитированием
  #15 (permalink)  
Старый 16.01.2021, 17:18
Аспирант
Отправить личное сообщение для Konstantin47 Посмотреть профиль Найти все сообщения от Konstantin47
 
Регистрация: 12.01.2021
Сообщений: 32

про ту строчку в js не через alert ничего не скажу, а про сами стили. там же рабочий код? получается, что я уже и рабочим пользоваться не умею.

отпишу позже "достижения"
Ответить с цитированием
  #16 (permalink)  
Старый 16.01.2021, 17:50
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Konstantin47,
Пример: рабочий код, запустить, кликнуть по любой дате
<!DOCTYPE html>
<html>
<head>
    <title>Untitled</title>
    <meta charset="utf-8">
    <style type="text/css">
    [name='myform'] {
        display: none;
    }
    [name='myform'].open {
        display: initial;
    }
    </style>
    <style>
    #calendar2 {
        width: 100%;
        font: monospace;
        line-height: 1.2em;
        font-size: 15px;
        text-align: center;
    }
    #calendar2 thead tr:last-child {
        font-size: small;
        color: rgb(85, 85, 85);
    }
    #calendar2 thead tr:nth-child(1) td:nth-child(2) {
        color: rgb(50, 50, 50);
    }
    #calendar2 thead tr:nth-child(1) td:nth-child(1):hover, #calendar2 thead tr:nth-child(1) td:nth-child(3):hover {
        cursor: pointer;
    }
    #calendar2 tbody td {
        color: rgb(44, 86, 122);
    }
    #calendar2 tbody td:nth-child(n+6), #calendar2 .holiday {
        color: rgb(231, 140, 92);
    }
    #calendar2 tbody td.today {
        background: rgb(220, 0, 0);
        color: #fff;
    }
    </style>
    <script>
document.addEventListener( "DOMContentLoaded" , function() {
 const on = (parent, event, selector, handler) => parent.addEventListener(event, ({target}) => {
     if(target = target.closest(selector)) handler(target)
 })
 const fn = el => {
 document.myform.classList.add("open")
 //alert(`${el.textContent} форма открывайся, раз, два!!!`);
 }
 on(document, "click", "#calendar2 tbody td", fn);
  });
    </script>
</head>
<body>
<table id="calendar2">
  <thead>
    <tr><td>‹<td colspan="5"><td>›
    <tr><td>Пн<td>Вт<td>Ср<td>Чт<td>Пт<td>Сб<td>Вс
  <tbody>
</table>
<script>
function Calendar2(id, year, month) {
var Dlast = new Date(year,month+1,0).getDate(),
    D = new Date(year,month,Dlast),
    DNlast = new Date(D.getFullYear(),D.getMonth(),Dlast).getDay(),
    DNfirst = new Date(D.getFullYear(),D.getMonth(),1).getDay(),
    calendar = '<tr>',
    month=["Январь","Февраль","Март","Апрель","Май","Июнь","Июль","Август","Сентябрь","Октябрь","Ноябрь","Декабрь"];
if (DNfirst != 0) {
  for(var  i = 1; i < DNfirst; i++) calendar += '<td>';
}else{
  for(var  i = 0; i < 6; i++) calendar += '<td>';
}
for(var  i = 1; i <= Dlast; i++) {
  if (i == new Date().getDate() && D.getFullYear() == new Date().getFullYear() && D.getMonth() == new Date().getMonth()) {
    calendar += '<td class="today">' + i;
  }else{
    calendar += '<td>' + i;
  }
  if (new Date(D.getFullYear(),D.getMonth(),i).getDay() == 0) {
    calendar += '<tr>';
  }
}
for(var  i = DNlast; i < 7; i++) calendar += '<td>&nbsp;';
document.querySelector('#'+id+' tbody').innerHTML = calendar;
document.querySelector('#'+id+' thead td:nth-child(2)').innerHTML = month[D.getMonth()] +' '+ D.getFullYear();
document.querySelector('#'+id+' thead td:nth-child(2)').dataset.month = D.getMonth();
document.querySelector('#'+id+' thead td:nth-child(2)').dataset.year = D.getFullYear();
if (document.querySelectorAll('#'+id+' tbody tr').length < 6) {  // чтобы при перелистывании месяцев не "подпрыгивала" вся страница, добавляется ряд пустых клеток. Итог: всегда 6 строк для цифр
    document.querySelector('#'+id+' tbody').innerHTML += '<tr><td>&nbsp;<td>&nbsp;<td>&nbsp;<td>&nbsp;<td>&nbsp;<td>&nbsp;<td>&nbsp;';
}
}
Calendar2("calendar2", new Date().getFullYear(), new Date().getMonth());
// переключатель минус месяц
document.querySelector('#calendar2 thead tr:nth-child(1) td:nth-child(1)').ondblclick = function() {
  Calendar2("calendar2", document.querySelector('#calendar2 thead td:nth-child(2)').dataset.year, parseFloat(document.querySelector('#calendar2 thead td:nth-child(2)').dataset.month)-1);
}
// переключатель плюс месяц
document.querySelector('#calendar2 thead tr:nth-child(1) td:nth-child(3)').ondblclick = function() {
  Calendar2("calendar2", document.querySelector('#calendar2 thead td:nth-child(2)').dataset.year, parseFloat(document.querySelector('#calendar2 thead td:nth-child(2)').dataset.month)+1);
}
// i - day
</script>
 <form name="myform">
 <label for="name"><b>Proszę wpisać Imie Nazwisko</b></label>
    <input type="text" placeholder="Enter name" name="name" required>
 <br>
 <br>
 <label for="time"><b>Proszę wybrać godzine</b></label>
 <input type="time" name="cron" value="15:15" min="8:00" max="20:00">
 </form>
 </body>
</html>
Ответить с цитированием
  #17 (permalink)  
Старый 16.01.2021, 20:35
Аспирант
Отправить личное сообщение для Konstantin47 Посмотреть профиль Найти все сообщения от Konstantin47
 
Регистрация: 12.01.2021
Сообщений: 32

вообщем, я после тех стилей новый стиль вставлял. Спасибо большое! До встречи и буду стараться, так не тупить.

просто у меня проблема с - вот раздел введения в js все логично и понятно, где функцию математическую через log вывести или длину массива посчитать и число из середины показать, а вот, когда началось все со словами и элементами DOm , банально не понимаю, где этот словарь слов брать и где цифры со словами, вот, как с классами, я показал, ход мысли и , как бы по статье учебника - так ничего общего. в css стилях я смог скрыть форму, но про открытие формы в js без alert я бы не догадался, так даже через promt пробовал .
Ответить с цитированием
  #18 (permalink)  
Старый 18.02.2021, 19:19
Аспирант
Отправить личное сообщение для Konstantin47 Посмотреть профиль Найти все сообщения от Konstantin47
 
Регистрация: 12.01.2021
Сообщений: 32

Ронни, можно спросить? где находится значение для сохранения в LokalStorage? Если сохранять изменения в событии по клику.
Ответить с цитированием
  #19 (permalink)  
Старый 18.02.2021, 19:30
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Сообщение от Konstantin47
где находится значение для сохранения в LokalStorage? Если сохранять изменения в событии по клику
нигде, придумайте имя ключа , там и будет хранится.
LocalStorage на пальцах

https://learn.javascript.ru/localstorage

https://developer.mozilla.org/ru/doc...torage/setItem
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как кликом по ссылке скрыть ее, а на ее месте вызвать div блок? Lefseq Общие вопросы Javascript 7 23.07.2020 21:29
Как вызвать кастомные события внутри класса? mazahaler Элементы интерфейса 1 30.01.2019 13:57
Как с помощью PHP сохранить какие-либо изменения в HTML документе? FirstFrost Работа 6 06.09.2010 16:16
Как корректно применить последовательность fadeOut, html, fadeIn? SkyZee jQuery 2 02.09.2010 18:27
Как с помощью PHP сохранить какие-либо изменения в HTML документе? FirstFrost Общие вопросы Javascript 1 15.07.2010 17:12