Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
年月日の入力どうしよう
Search
otukutun
November 12, 2020
Technology
2
9.1k
年月日の入力どうしよう
otukutun
November 12, 2020
Tweet
Share
More Decks by otukutun
See All by otukutun
コネヒトマルシェ20221209.pdf
otukutun
0
770
Other Decks in Technology
See All in Technology
Oracle Cloud Infrastructure:2025年9月度サービス・アップデート
oracle4engineer
PRO
0
220
【GPT-5本出版記念】npaka による AIの今とこれから と AI時代の生存戦略
npaka
2
790
mypyの10年、pyrightの5年 tyの挑戦 - 型チェッカー進化論 -
byfarsmall
0
130
Why React!?? Next.jsそしてReactを改めてイチから選ぶ
ypresto
6
2.3k
施策が均質化する採用市場で何を捨て 何を大事にしていくかを考える
akyun
0
220
Goに育てられ開発者向けセキュリティ事業を立ち上げた僕が今向き合う、AI × セキュリティの最前線 / Go Conference 2025
flatt_security
0
140
Создание мультиагентной системы на базе AI Studio
shwars
0
190
みん強のこれまでとこれから
genshun9
1
390
AIが書いたコードをAIが検証する!自律的なモバイルアプリ開発の実現
henteko
1
190
Oracle Base Database Service 技術詳細
oracle4engineer
PRO
11
76k
Built to Rank: Why Your Hosting Stack Is an SEO Power Tool
rogermedia
0
120
20250929_QaaS_vol20
mura_shin
0
100
Featured
See All Featured
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
114
20k
Designing Experiences People Love
moore
142
24k
What's in a price? How to price your products and services
michaelherold
246
12k
Facilitating Awesome Meetings
lara
56
6.6k
KATA
mclloyd
32
14k
Visualization
eitanlees
148
16k
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
Measuring & Analyzing Core Web Vitals
bluesmoon
9
600
Unsuck your backbone
ammeep
671
58k
A better future with KSS
kneath
239
17k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
51k
Transcript
݄ͷೖྗͲ͏͠Α͏ @otukutun
ࣗݾհ • @otukutun • αʔόʔαΠυΤϯδχΞ • ҎલiOS/Ruby on RailsΛ৮͍ͬͯ·͕ͨ͠ɺࠓPHP ΛϝΠϯʹॻ͍ͯ·͢
• Ϗʔϧ͕͖Ͱ͢
݄ͷೖྗػձଟ͍ • ੜ݄ • ECͰͷ౸ணࢦఆ • ཱྀߦ/ҿ৯ళͷ༧
݄ͷ࣮ํ๏ • input type=date • select / input type=text Ͱ݄ΛͦΕͧΕදࣔ
• JavaScriptͰΧϨϯμʔUIΛදࣔ • React/Vue.js • jQuery UI(Datepicker) ͍Ζ͍Ζ࣮ํ๏͋Δʂʂ
ࠓճ࡞ͬͨαΠτͷࣄྫΛ ͓͠͠·͢ʂ!
ࠓճͭͬͨ͘αΠτ • ΩϟϯϖʔϯαΠτ • 9ͭͷ߲Λೖྗͯ͠Ԡื͢Δͱ͕Β͑ΔαΠτ • εϚʔτϑΥϯϝΠϯͷαΠτɻPCͰ։͍ͨ߹෯Λ ݻఆ͢Δ • toCαΠτ(ͲͷϒϥβͰಈ͘Α͏ʹ͢Δඞཁ͕͋Δ)
• JSʹͦΜͳͬͯͳ͍ɻബ͘jQueryΛ͏ JavaScriptΛΘͣগͳ͍Ͱ࣮ݱ͍ͨ͠ʂʂ
input type=dateͰ࣮ͯ͠ΈΔ Android iOS13 safari Android / iOSͰೖྗUIҧ͏͚ͲɺͳΜ͔Αͦ͞͏ʂʂ
input type=dateͰ࣮ͯ͠ΈΔ Chrome macOS Catalina Safari macOS Catalina ChromeΧϨϯμʔUI͕ͩɺSafariͩͱinput type=textʹͳͬͯ͠·͏
input type=dateͰ࣮ͯ͠ΈΔ • ݄ͷ࠷େɺ࠷খͷࢦఆΛ͍ͨ͠ • ͜ͷͷਓ͚͕ͩਃ͠ࠐΊΔͱ͍͏੍ݶΛ͍ͨ͠ Android iOS13 safari AndroidͰͰ͖Δ͚ͲɺiOS
safariͰͰ͖ͳͦ͏
input type=dateΊ·ͨ͠ • iOS safari Ͱ࠷େɺ࠷খͷࢦఆ͕Ͱ͖ͳ͍ • ະೖྗ࣌ʹplaceholder͕Ұ෦௵Εͯ͠·͏ on iOS13
Safari • heightΛࢦఆ͢Δ͜ͱͰճආՄೳ • macOS Safari Ͱͦͦ͑ͳ͍(αΠτతʹӨڹܰ ඍ • Safari Technology Preview 112͔Β͑ΔΑ͏ʹͳΔ
select boxͰ࣮ͨ͠ Android iOS13 safari
select boxͰ࣮ͨ͠ Chrome macOS Catalina Safari macOS Catalina σόΠεΘͣ΄΅ಉ͡ೖྗମݧΛఏڙͰ͖ͦ͏ʂʂ
select boxͰ࣮ͨ͠ • ࠷େɺ࠷খͷࢦఆ͕Ͱ͖Δʂ • ͰͷίϯτϩʔϧͷΈʹͳΔ͕Ұ୴ڐ༰ • CakePHPͷFormHelperͰͷੜ͕༰қ • ͲͷϒϥβͰಉ͡UIΛఏڙͰ͖Δ
ଞͷબࢶ • jQuery UIͷDatepickerΛ͏ • HTML5 polyfillΛ͏ • valueͷdate-format͕ϒϥβຖʹҟͳΔ͜ͱͷղܾ ࡦʹΈ͑ΔͷͰࠓճͷཁ݅Ͱద͔ෆ໌
• https://github.com/chemerisuk/better-dateinput-polyfill
༩ଠ iOS 13 iOS 14
࠷ޙʹ ࠷ߴͷ݄ೖྗϑΥʔϜΛͭ͘Γ·͠ΐ͏ʂʂʂ