Chciałbym dynamicznie generować ciąg tekstowy na podstawie bieżącego dnia. Na przykład, jeśli jest dzień 1, chciałbym, aby mój kod wygenerował = "To <dynamic> 1 * <ciąg dynamiczny> st </ ciąg dynamiczny> * </dynamic>".
Łącznie jest 12 dni, więc wykonałem następujące czynności:
Skonfigurowałem pętlę for, która zapętla się przez 12 dni.
W moim html dałem swojemu elementowi unikalny identyfikator, za pomocą którego mam go kierować, patrz poniżej:
<h1 id="dynamicTitle" class="CustomFont leftHeading shadow">On The <span></span> <em>of rest of generic text</em></h1>
Następnie w mojej pętli for mam następujący kod:
$("#dynamicTitle span").html(i); var day = i; if (day == 1) { day = i + "st"; } else if (day == 2) { day = i + "nd" } else if (day == 3) { day = i + "rd" }
AKTUALIZACJA
To jest cała pętla for zgodnie z żądaniem:
$(document).ready(function () {
for (i = 1; i <= 12; i++) {
var classy = "";
if (daysTilDate(i + 19) > 0) {
classy = "future";
$("#Day" + i).addClass(classy);
$("#mainHeading").html("");
$("#title").html("");
$("#description").html("");
} else if (daysTilDate(i + 19) < 0) {
classy = "past";
$("#Day" + i).addClass(classy);
$("#title").html("");
$("#description").html("");
$("#mainHeading").html("");
$(".cta").css('display', 'none');
$("#Day" + i + " .prizeLink").attr("href", "" + i + ".html");
} else {
classy = "current";
$("#Day" + i).addClass(classy);
$("#title").html(headings[i - 1]);
$("#description").html(descriptions[i - 1]);
$(".cta").css('display', 'block');
$("#dynamicImage").attr("src", ".." + i + ".jpg");
$("#mainHeading").html("");
$(".claimPrize").attr("href", "" + i + ".html");
$("#dynamicTitle span").html(i);
var day = i;
if (day == 1) {
day = i + "st";
} else if (day == 2) {
day = i + "nd"
} else if (day == 3) {
day = i + "rd"
} else if (day) {
}
}
}
javascript
jquery
numbers
Antonio Vasilev
źródło
źródło
if
bloku, który jest dalej zawarty w pętli? Pokaż więcej kodu ....Odpowiedzi:
Te zasady są następujące:
Następujący kod JavaScript (przepisany w czerwcu 2014) umożliwia to:
Przykładowe dane wyjściowe dla liczb od 0 do 115:
źródło
111
,112
i113
powinno spowodować"111th"
,"112th"
i"113th"
odpowiednio nie"111st"
,"112nd"
oraz"113rd"
wytwarzane przez funkcję jak obecnie kodowanej.n=>n+(n%10==1&&n%100!=11?'st':n%10==2&&n%100!=12?'nd':n%10==3&&n%100!=13?'rd':'th')
Z Shopify
źródło
Minimalne jednowierszowe podejście do przyrostków porządkowych
(dotyczy dodatnich liczb całkowitych, zobacz poniżej inne odmiany)
Wyjaśnienie
Zacznij od tablicy z przyrostkami
["st", "nd", "rd"]
. Chcemy zmapować liczby całkowite kończące się na 1, 2, 3 (ale nie kończące się na 11, 12, 13) na indeksy 0, 1, 2.Inne liczby całkowite (w tym kończące się na 11, 12, 13) można odwzorować na cokolwiek innego - indeksy nie znalezione w tablicy będą obliczane do
undefined
. To jest fałszywe w javascript i przy użyciu logiki lub (|| "th"
) wyrażenie zwróci"th"
dla tych liczb całkowitych, co jest dokładnie tym, czego chcemy.Wyrażenie
((n + 90) % 100 - 10) % 10 - 1
wykonuje mapowanie. Rozbijając to:(n + 90) % 100
: To wyrażenie przyjmuje wejściową liczbę całkowitą - 10 mod 100, odwzorowując 10 na 0, ... 99 do 89, 0 do 90, ..., 9 do 99. Teraz liczby całkowite kończące się na 11, 12, 13 znajdują się na niższym koniec (mapowany na 1, 2, 3).- 10
: Teraz 10 jest mapowane na −10, 19 na −1, 99 do 79, 0 do 80, ... 9 do 89. Liczby całkowite kończące się na 11, 12, 13 są odwzorowywane na ujemne liczby całkowite (−9, −8, −7).% 10
: Teraz wszystkie liczby całkowite kończące się na 1, 2 lub 3 są mapowane na 1, 2, 3. Wszystkie inne liczby całkowite są mapowane na coś innego (11, 12, 13 są nadal mapowane na -9, -8, -7).- 1
: Odejmowanie jednego daje końcowe mapowanie 1, 2, 3 na 0, 1, 2.Sprawdzam, czy to działa
Wariacje
Zezwalanie na ujemne liczby całkowite:
W składni grubej strzałki ES6 (funkcja anonimowa):
Aktualizacja
Jeszcze krótszą alternatywą dla dodatnich liczb całkowitych jest wyrażenie
Zobacz ten post aby uzyskać wyjaśnienie.
Zaktualizuj 2
źródło
Możesz skorzystać z lokalnych funkcji danych bibliotek momentów .
Kod:
źródło
Intl.PluralRules
, metoda standardowa .Chciałbym po prostu zrezygnować z kanonicznego sposobu robienia tego tutaj, ponieważ nikt o tym nie wie.
Intl.PluralRules
Konstruktor (Projekt ECMA 402)źródło
Masz tylko 12 dni? Kusiłbym, aby uczynić to zwykłą tablicą wyszukiwania:
następnie
lub
źródło
$("#dynamicTitle span").html(suffix[i-1]);
Dzieląc liczbę na tablicę i odwracając, możemy łatwo sprawdzić ostatnie 2 cyfry numeru za pomocą
array[0]
iarray[1]
.Jeśli liczba jest nastolatką
array[1] = 1
, wymaga „th”.źródło
źródło
n - 1
części (zwraca wartość niezdefiniowaną). Błąd również dla liczb większych niż 110, np.getSuffix(111)
Zwraca „st”. Rozwiązuje problem PO, w którym liczby wynoszą od 1 do 12, ale nie jest rozwiązaniem ogólnym. :-(Napisałem tę funkcję, aby rozwiązać ten problem:
Dzięki temu możesz po prostu wpisać
.addSuffix()
dowolną liczbę, a otrzymasz to, co chcesz. Na przykład:źródło
number
w tym ciąguvar lastDigits=n.substring(number.length-2);
należy zmienić nathis
n
zamiastthis
, ale dziękuję za wskazanie tego błędu! :)Alternatywna wersja funkcji porządkowej mogłaby wyglądać następująco:
Zmienne są nazywane bardziej jawnie, używają konwencji wielbłądziej wielkości i mogą być szybsze.
źródło
Napisałem tę prostą funkcję pewnego dnia. Chociaż na randkę nie potrzebujesz większych liczb, będzie to również uwzględniać wyższe wartości (1013, 36021 itd.)
źródło
function ordsfx(a){return["th","st","nd","rd"][(a=~~(a<0?-a:a)%100)>10&&a<14||(a%=10)>3?0:a]}
Zobacz wersję z adnotacjami na https://gist.github.com/furf/986113#file-annotated-js
Krótkie, słodkie i wydajne, tak jak powinny być funkcje użytkowe. Działa z każdą liczbą całkowitą / zmiennoprzecinkową ze znakiem / bez znaku. (Nawet jeśli nie wyobrażam sobie potrzeby uporządkowania pływaków)
źródło
Oto inna opcja.
Zwróć uwagę na wyjątek dla nastolatków? Nastolatki są takie dziwne!
Edycja: zapomniałem o jedenastym i dwunastym
źródło
Chciałem udzielić funkcjonalnej odpowiedzi na to pytanie, aby uzupełnić istniejącą odpowiedź:
stworzyliśmy tablicę wartości specjalnych, ważną rzeczą do zapamiętania jest to, że tablice mają indeks zaczynający się od zera, więc ordinalSuffix [0] jest równe „st”.
Nasza funkcja numberToOrdinal sprawdza, czy liczba kończy się liczbą nastolatków, w którym to przypadku należy dodać do liczby „th”, ponieważ wszystkie liczby porządkowe to „th”. W przypadku, gdy liczba nie jest nastolatką, przekazujemy liczbę do addSuffix, która dodaje liczbę do liczby porządkowej, która jest określana przez to, czy liczba minus 1 (ponieważ używamy indeksu od zera) mod 10 ma resztę 2 lub mniej jest pobierany z tablicy, w przeciwnym razie jest to „th”.
przykładowe wyjście:
źródło
Stary, który zrobiłem dla moich rzeczy ...
źródło
Zdecydowanie polecam doskonałą bibliotekę date-fns . Szybki, modułowy, niezmienny, działa ze standardowymi datami.
Zobacz dokumentację date-fns: https://date-fns.org/v2.0.0-alpha.9/docs/format
źródło
Napisałem tę funkcję dla wyższych liczb i wszystkich przypadków testowych
źródło
Oto nieco inne podejście (nie sądzę, aby inne odpowiedzi to robiły). Nie jestem pewien, czy to kocham, czy nienawidzę, ale działa!
źródło
To jest dla jednego liniowca i miłośników es6
Inną opcją dla + be number byłoby:
Aby pozbyć się przedrostka porządkowego, po prostu użyj tych:
możesz dowolnie modyfikować w zależności od potrzeb
źródło
Możesz także użyć
scales::ordinal()
funkcji. Jest szybki i prosty w użyciu.źródło
Zdecydowanie polecam, jest to bardzo łatwe i proste do odczytania. Mam nadzieję, że to pomoże?
WYNIK
źródło
Możesz użyć
1<sup>st</sup> 2<sup>nd</sup> 3<sup>rd</sup> 4<sup>th</sup>
do umieszczania przyrostka
źródło