Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #21 (permalink)  
Старый 13.04.2019, 00:46
Кандидат Javascript-наук
Отправить личное сообщение для Besprizornik Посмотреть профиль Найти все сообщения от Besprizornik
 
Регистрация: 24.02.2019
Сообщений: 109

Сообщение от Rise Посмотреть сообщение
если в 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> вывести текстом день недели, если пользователь введёт и дату и день недели которые несоответствуют друг другу, и какую роль играет выбор дня недели? зачем делать список с выбором если правильнее просто вывести текстом.
Ответить с цитированием
  #22 (permalink)  
Старый 13.04.2019, 01:29
Кандидат Javascript-наук
Отправить личное сообщение для Besprizornik Посмотреть профиль Найти все сообщения от Besprizornik
 
Регистрация: 24.02.2019
Сообщений: 109

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

Сообщение от laimas
Besprizornik, приводить количество дней месяца к текущему месяцу
и в этом вопросе я в принципе полностью согласен, просто раньше считал преждевременно это решать пока дата не конвертируется правильно
Ответить с цитированием
  #23 (permalink)  
Старый 13.04.2019, 18:38
Профессор
Отправить личное сообщение для Rise Посмотреть профиль Найти все сообщения от Rise
 
Регистрация: 07.11.2013
Сообщений: 4,199

Сообщение от Besprizornik
зачем делать список с выбором
Ну во 1-х это красиво, во 2-х если надо чтобы список не раскрывался можно добавить атрибут disabled, либо атрибут readonly и css-правило select[readonly] option { display:none; }.
Ответить с цитированием
  #24 (permalink)  
Старый 13.04.2019, 22:27
Кандидат Javascript-наук
Отправить личное сообщение для Besprizornik Посмотреть профиль Найти все сообщения от Besprizornik
 
Регистрация: 24.02.2019
Сообщений: 109

Rise,
так я сделал пустой список, и поверх него отпозиционировал спан, так чтобы выглядело словно это текст опции, задал ширину списка для опции с самым длинным текстом, всё выглядит словно день недели находится в списке а не поверх него, вопрос как сейчас вывести текстом день недели
Ответить с цитированием
  #25 (permalink)  
Старый 13.04.2019, 23:49
Профессор
Отправить личное сообщение для Rise Посмотреть профиль Найти все сообщения от Rise
 
Регистрация: 07.11.2013
Сообщений: 4,199

Такое ощущение что с каждым постом ты тупеешь всё больше) хотя должно быть вроде наоборот, то 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>
Ответить с цитированием
  #26 (permalink)  
Старый 14.04.2019, 14:10
Кандидат Javascript-наук
Отправить личное сообщение для Besprizornik Посмотреть профиль Найти все сообщения от Besprizornik
 
Регистрация: 24.02.2019
Сообщений: 109

Rise,
а мне кажется что мы оба немного ступили, в html select пустой, все option подставляются скриптом, и нужной option присваивается атрибут selected, так ведь?
а если вместо этого подставить только одну option из семи а остальные не показывать, будет то что надо.
Ответить с цитированием
  #27 (permalink)  
Старый 14.04.2019, 14:34
Кандидат Javascript-наук
Отправить личное сообщение для Besprizornik Посмотреть профиль Найти все сообщения от Besprizornik
 
Регистрация: 24.02.2019
Сообщений: 109

Rise,
сделал так,
Сообщение от Rise Посмотреть сообщение
_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>
Ответить с цитированием
  #28 (permalink)  
Старый 14.04.2019, 17:29
Профессор
Отправить личное сообщение для Rise Посмотреть профиль Найти все сообщения от Rise
 
Регистрация: 07.11.2013
Сообщений: 4,199

Сообщение от Besprizornik
нужной option присваивается атрибут selected
Где ты там хоть одно слово selected нашел? Есть свойство value для этого.
Сообщение от Besprizornik
подставить только одну option из семи а остальные не показывать, будет то что надо.
У тебя что в посте 26 остальные option показывает?
Сообщение от Besprizornik
сделал так
Не сделал, у меня написано про "оба".

Последний раз редактировалось Rise, 14.04.2019 в 17:33.
Ответить с цитированием
  #29 (permalink)  
Старый 14.04.2019, 20:47
Кандидат Javascript-наук
Отправить личное сообщение для Besprizornik Посмотреть профиль Найти все сообщения от Besprizornik
 
Регистрация: 24.02.2019
Сообщений: 109

Сообщение от Rise Посмотреть сообщение
У тебя что в посте 26 остальные option показывает?
в 26 посте? с <select readonly> да показывает две опции

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

Сообщение от Rise Посмотреть сообщение
Не сделал, у меня написано про "оба".
а можно чуть подробнее, какие именно номера строк в 28 посте пропустил?
Ответить с цитированием
  #30 (permalink)  
Старый 14.04.2019, 23:22
Профессор
Отправить личное сообщение для Rise Посмотреть профиль Найти все сообщения от Rise
 
Регистрация: 07.11.2013
Сообщений: 4,199

Сообщение от Besprizornik
с <select readonly> да показывает две опции
В старых браузерах может не работать display:none для option. Обнови браузер.
Сообщение от Besprizornik
а <select disabled> меняет цвет
Это можно исправить стилями, так же как ты делал select-ы фиолетовыми.
Сообщение от Besprizornik
какие именно номера строк в 28 посте пропустил?
В текстовых редакторах есть функции Найти и Заменить текст, давай ты их освоишь.
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Вывести на печать DIV как его видно в браузере (с учетом фона с стилей) unomomento Элементы интерфейса 5 27.12.2013 23:43
Как приплюсовать 3 inputa и вывести, сообщение. ainur777 Элементы интерфейса 2 10.11.2013 14:33
Как вывести значение выбранного селекта в блок? And5 Events/DOM/Window 23 11.09.2013 18:32
Подскажите, пжлст, как вывести в тот же документ результат ф-ции? LexXxeL Элементы интерфейса 4 13.05.2009 13:26
Как вывести на экран значение функции SELECT MAX(id) Владдд Серверные языки и технологии 3 25.01.2009 16:07