Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   День недели, как вывести на экран? (https://javascript.ru/forum/misc/77226-den-nedeli-kak-vyvesti-na-ehkran.html)

Besprizornik 12.04.2019 23:46

Цитата:

Сообщение от Rise (Сообщение 506462)
если в html два select с name="gwDay" и name="jwDay", тогда в js оба C.wDay.value = wd надо заменить на C.gwDay.value = C.jwDay.value = wd, а C.wDay.innerHTML = o на C.gwDay.value = C.jwDay.value = o

с эрами разобрался, а со списком дней недели не получилось, да немного не так надо, надо в строки 21 и 37 в <span class="weekday"></span> вывести текстом день недели, если пользователь введёт и дату и день недели которые несоответствуют друг другу, и какую роль играет выбор дня недели? зачем делать список с выбором если правильнее просто вывести текстом.

Besprizornik 13.04.2019 00:29

Цитата:

Сообщение от Besprizornik
кто не понял вопроса надо вывести текстом сегодняшний день недели в обоих спанах с классом "day_week",пустые вып списки служат вместо фонового изображения

вот я как бы пробовал объяснить

Цитата:

Сообщение от laimas
Besprizornik, приводить количество дней месяца к текущему месяцу

и в этом вопросе я в принципе полностью согласен, просто раньше считал преждевременно это решать пока дата не конвертируется правильно

Rise 13.04.2019 17:38

Цитата:

Сообщение от Besprizornik
зачем делать список с выбором

Ну во 1-х это красиво, во 2-х если надо чтобы список не раскрывался можно добавить атрибут disabled, либо атрибут readonly и css-правило select[readonly] option { display:none; }.

Besprizornik 13.04.2019 21:27

Rise,
так я сделал пустой список, и поверх него отпозиционировал спан, так чтобы выглядело словно это текст опции, задал ширину списка для опции с самым длинным текстом, всё выглядит словно день недели находится в списке а не поверх него, вопрос как сейчас вывести текстом день недели

Rise 13.04.2019 22:49

Такое ощущение что с каждым постом ты тупеешь всё больше) хотя должно быть вроде наоборот, то js-код пишешь вне тэга script, теперь вот эти кульбиты со спан. Может до тебя туго доходит, но я это имел ввиду, это выглядит и работает так как тебе и надо, нажми Посмотреть!
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>select[readonly] option { display:none; }</style>
</head>
<body>

<select readonly>
    <option>1</option>
    <option>2</option>
</select>

<select disabled>
    <option>1</option>
    <option>2</option>
</select>

</body>
</html>

Besprizornik 14.04.2019 13:10

Rise,
а мне кажется что мы оба немного ступили, в html select пустой, все option подставляются скриптом, и нужной option присваивается атрибут selected, так ведь?
а если вместо этого подставить только одну option из семи а остальные не показывать, будет то что надо.

Besprizornik 14.04.2019 13:34

Rise,
сделал так,
Цитата:

Сообщение от Rise (Сообщение 506462)
_eras не надо трогать, если в html два select с name="gwDay" и name="jwDay", тогда в js оба C.wDay.value = wd надо заменить на C.gwDay.value = C.jwDay.value = wd, а C.wDay.innerHTML = o на C.gwDay.value = C.jwDay.value = o

но день недели не показывает, и при нажатии на кнопку "01.01.45г до н.э. юлианская дата подставляется в форму, но не конвертируется в григорианскую.

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Конвертировать дату из григорианского календаря в юлианский и обратно.</title>
<style>
body, div, span, select, input, button { font: 16px serif; }
div { padding : 5px; margin: 0 5px 5px 5px; border: 1px solid #999; }
.position { display: inline-block; padding: 0; margin: 0 0 5px 0; position: relative; border: none; }
.wDay { width: 136px; }
.weekday { display: inline-block; position: relative; right: 132px; top : 1px; }
.date { white-spage: nowrap; padding: 0; margin: 0 0 5px 0; border: none; }
</style>
</head>
<body>
<form name="converter">
    <div>
    <span>Сегодня:</span><br>
    <div class="position">
   <select name="gwDay" class="wDay"></select>
    <span class="weekday"></span>
    </div>
    <div class="date">
    <select name="gDay"></select>
    <select name="gMonth"></select>
    <input type="number" name="gYear" size="5" min="-4713">
    <i>г.</i>
    <select name="gEra"></select></div>
по григорианскому календарю<br>(<i>новый стиль</i>).<br>
    <input type="button" name="gCalc" value="Смотреть"> 
    <button type="button" class="express" value="g_n_o_w_ce">Сбросить</button>
    </div>
    <div>
    <span>Сегодня:</span><br>
    <div class="position">
   <select name="jwDay" class="wDay"></select>
    <span class="weekday"></span>
    </div>
    <div class="date">
    <select name="jDay"></select>
    <select name="jMonth"></select>
    <input type="number" name="jYear" size="5" min="-4712">
    <i>г.</i>
    <select name="jEra"></select></div>
по юлианскому календарю<br>(<i>старый стиль</i>).<br>
    <input type="button" name="jCalc" value="Смотреть"> 
    <button type="button" class="express" value="g_n_o_w_ce">Сбросить</button>
    </div>
    <div>
    Впервые григорианский календарь был введён папой римским Григорием XIII в католических странах  с 5 октября 1582 года взамен прежнего юлианского: следующим днём после четверга 4 октября стала <button type="button" class="express" value="g_15_10_1582_ce">пятница 15 октября 1582 г. н. э.</button>. Григорианский календарь используется в большинстве государств и стран мира. В литературе также применяется название — Новый стиль.
      </div>
      <div>
    Пролептический григорианский календарь (предваряющий григорианский календарь, от др.-греч. πρόληψις «предвосхищение») — календарь, расширяющий григорианский календарь на период до его введения 15 октября 1582 года.
      </div>
      <div>
	    Юлиа́нский  календа́рь — календарь, разработанный группой александрийских астрономов во главе с Созигеном. Календарь назван в честь Юлия Цезаря, по указу которого был введен в Римской империи с <button type="button" class="express" value="j_1_1_45_bce">1 января 45 г. до н. э.</button> Год по юлианскому календарю начинается 1 января, так как именно в этот день с 153 года до н. э. избранные комициями консулы вступали в должность. Юлианский календарь заменил старый римский календарь и основывался на астрономической культуре эллинистического Египта.
</div>
</form>
<script>
document.addEventListener('DOMContentLoaded', function () {
// https://en.wikipedia.org/wiki/Julian_day#Julian_day_number_calculation
// The algorithms are valid for JDN >= 0, Gregorian >= 24.11.-4713, Julian >= 01.01.-4712
function gregorianToJdn(d, m, y) {
    return tr((1461 * (y + 4800 + tr((m - 14) / 12))) / 4) +
           tr((367 * (m - 2 - 12 * tr((m - 14) / 12))) / 12) -
           tr((3 * tr((y + 4900 + tr((m - 14) / 12)) / 100)) / 4) + d - 32075;
}
function julianToJdn(d, m, y) {
    return 367 * y - tr((7 * (y + 5001 + tr((m - 9) / 7))) / 4) + tr((275 * m) / 9) + d + 1729777;
}
function jdnToJulianOrGregorian(j, to) { // to: true (julian) false (gregorian)
    var f = (to) ? (j + 1401) : (j + 1363 + tr((tr((4 * j + 274277) / 146097) * 3) / 4));
    var e = 4 * f + 3, h = 5 * tr((e % 1461) / 4) + 2;
    var d = tr((h % 153) / 5) + 1, m = ((tr(h / 153) + 2) % 12) + 1, y = tr(e / 1461) - 4716 + tr((14 - m) / 12);
    return { d: d, m: m, y: y }; 
}
function jdnToWeekDay(j) { return (j % 7) + 1; }
function tr(n) { return n - n % 1; } // truncate (for integer division)
// -- wiki end --
var C = document.converter;
// options
var wdays = ['Понедельник','Вторник','Среда','Четверг','Пятница','Суббота','Воскресенье'];
for (var o = '', i = 0; i < wdays.length; i++) o += '<option value="' + (i + 1) + '">' + wdays[i] + '</option>';
C.gwDay.value = C.jwDay.value = o
for (var o = '', i = 1; i <= 31; i++) o += '<option value="' + i  + '">' + i + '</option>';
C.gDay.innerHTML = C.jDay.innerHTML = o;
var months = ['января','февраля','марта','апреля','мая','июня','июля','августа','сентября','октября','ноября','декабря'];
for (var o = '', i = 0; i < months.length; i++) o += '<option value="' + (i + 1) + '">' + months[i] + '</option>';
C.gMonth.innerHTML = C.jMonth.innerHTML = o;
var eras = ['н. э.','до н. э.'], _eras = ['ce','bce'];
for (var o = '', i = 0; i < eras.length; i++) o += '<option value="' + _eras[i] + '">' + eras[i] + '</option>';
C.gEra.innerHTML = C.jEra.innerHTML = o;
// -- options end --
C.gCalc.onclick = function () {
    var gd = +C.gDay.value, gm = +C.gMonth.value, gy = historicalToAstronomical(+C.gYear.value, C.gEra.value);
    var jdn = gregorianToJdn(gd, gm, gy), wd = jdnToWeekDay(jdn), jd = jdnToJulianOrGregorian(jdn, true);
    var jy = astronomicalToHistorical(jd.y);
    C.gwDay.value = C.jwDay.value = wd, C.jDay.value = jd.d, C.jMonth.value = jd.m, C.jYear.value = jy.y, C.jEra.value = jy.e;
    onUpdateAll(jdn);
};
C.jCalc.onclick = function () {
    var jd = +C.jDay.value, jm = +C.jMonth.value, jy = historicalToAstronomical(+C.jYear.value, C.jEra.value);
    var jdn = julianToJdn(jd, jm, jy), wd = jdnToWeekDay(jdn), gd = jdnToJulianOrGregorian(jdn, false);
    var gy = astronomicalToHistorical(gd.y);
    C.wDay.value = wd, C.gDay.value = gd.d, C.gMonth.value = gd.m, C.gYear.value = gy.y, C.gEra.value = gy.e;
    onUpdateAll(jdn);
};
function initDate(c, d, m, y, e) {
    if (d + m + y == 'now') { var n = new Date(); d = n.getDate(), m = n.getMonth() + 1, y = n.getFullYear(); }
    C[c + 'Day'].value = d, C[c + 'Month'].value = m, C[c + 'Year'].value = y, C[c + 'Era'].value = e;
    C[c + 'Calc'].onclick();
}
function historicalToAstronomical(y, e) { // e: 'ce' or 'bce'
    e = (y < 1) ? 'bce' : e;
    return ((e == 'bce') && y > 0) ? (1 - y) : y;
}
function astronomicalToHistorical(y) {
    var e = (y < 1) ? 'bce' : 'ce';
    return { y: (e == 'bce') ? -(y - 1) : y, e: e };
}
for (var ess = C.querySelectorAll('.express'), es, i = 0; i < ess.length; i++) {
     es = ess[i], es.onclick = Function.prototype.apply.bind(initDate, null, es.value.split('_'));
}
initDate('g', 'n', 'o', 'w', 'ce');
function onUpdateAll(jdn) {
    console.log('JDN:', jdn);
    console.assert(jdn >= 2299161, 'Proleptic: Gn < 15.10.1582 CE');
    console.assert(jdn >= 1704987, 'Proleptic: Jn < 01.01.45 BCE');
    console.assert(jdn >= 0, 'Invalid: Gn < 24.11.4714 BCE, Jn < 01.01.4713 BCE');
}
});
</script>
</body>

</html>

Rise 14.04.2019 16:29

Цитата:

Сообщение от Besprizornik
нужной option присваивается атрибут selected

Где ты там хоть одно слово selected нашел? Есть свойство value для этого.
Цитата:

Сообщение от Besprizornik
подставить только одну option из семи а остальные не показывать, будет то что надо.

У тебя что в посте 26 остальные option показывает?
Цитата:

Сообщение от Besprizornik
сделал так

Не сделал, у меня написано про "оба".

Besprizornik 14.04.2019 19:47

Цитата:

Сообщение от Rise (Сообщение 506523)
У тебя что в посте 26 остальные option показывает?

в 26 посте? с <select readonly> да показывает две опции

а <select disabled> меняет цвет, что получается не красиво как ты выразился.

Цитата:

Сообщение от Rise (Сообщение 506523)
Не сделал, у меня написано про "оба".

а можно чуть подробнее, какие именно номера строк в 28 посте пропустил?

Rise 14.04.2019 22:22

Цитата:

Сообщение от Besprizornik
с <select readonly> да показывает две опции

В старых браузерах может не работать display:none для option. Обнови браузер.
Цитата:

Сообщение от Besprizornik
а <select disabled> меняет цвет

Это можно исправить стилями, так же как ты делал select-ы фиолетовыми.
Цитата:

Сообщение от Besprizornik
какие именно номера строк в 28 посте пропустил?

В текстовых редакторах есть функции Найти и Заменить текст, давай ты их освоишь.


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