HTML + CSS + JavaScript で簡単に導入できるdatetimepicker の比較｜TechRacho by BPS株式会社
2014.10.15 HTML + CSS + JavaScript で簡単に導入できるdatetimepicker の比較 最近MBA 買ったんですけど、ずっとドザーだったので全然慣れないshibuso です。トラックパッド使うと指が痛くなって泣ける…。 さて、今回は無料で公開されているdatetimepicker についてまとめたいと思います。datetimepicker と聞いてピンと来ない人は、フォームをクリックするとカレンダーが表示されて、そこで日時を選ぶ機能と思ってもらえば大体合ってます。少し前までプルダウンで年月日を選ぶのが普通だったのに、色々と便利になってきています。 とはいえdatetimepicker はまだあまり選択肢が無いように感じます。私の検索の仕方が悪いのかもしれませんが、日付のみを選択できるdatepicker の方が多いかと。そんな中、今回はdatetime
【JavaScript】 文字列切り出し（slice, substr, substring）の違い - のんびり猫プログラマの日常
引っ越し前のサイトから移植しました。 文字列の切り出しっていつも迷うよね。 実際にスクリプトを動かして確認してみよう。 slice 文字列.slice(開始位置 [,終了位置] ) 開始位置と終了位置を指定。終了位置は省略可能。 省略すると最後まで切り出す。 終了位置は、末尾が0になる。 開始位置をマイナス値にすると、後からの桁数になる（右端のみ切り出せる）。 <例> str.slice(3); //"3456789" str.slice(-2); //"89" str.slice(3, -1)); //"345678" var str = "0123456789"; str.slice( , ); strの内容 : 結果 substr 文字列.substr(開始位置 [,切り出す長さ] ) 開始位置と切り出す長さを指定。長さは省略可能。 省略すると最後まで切り出す。 開始位置をマイナス値
DateTimePicker - XDSoft plugins, scripts, program, parsers
PeriodPicker or TimePicker or PeriodDateTimePicker Try another perfect period picker or cool datetimepicker. Used TimePicker or perioddatetimepicker Compact mode like this datetimepicker mode or cute timepicker (touchable,draggable,use keyboard and mousewheel, support mobile devices). Read more Buy and Download Read more ... How do I use it? First include to page css and js files <!-- this should
[JS]最近のWebサイトで見かける気持ちいいアニメーション、便利な仕掛けや機能を実装するスクリプトのまとめ
最近のWebサイトで見かける気持ちいいインタラクションやエフェクト、面白い仕掛けのコンテンツや便利な機能を実装できるスクリプトやjQueryのプラグインを紹介します。
![[JS]最近のWebサイトで見かける気持ちいいアニメーション、便利な仕掛けや機能を実装するスクリプトのまとめ](https://cdn-ak-scissors.b.st-hatena.com/image/square/4df978511120c0727c18646f1d386ecdc2ab3a59/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201502%2F2015072304.png)
【PHP】Ajaxによる通信（リクエスト）かどうか判定する方法
リクエストのログを記録していくときにjQueryのajax通信を使う場合は除外したかったので、サーバー側で判別する方法を調べたメモ。 環境変数のHTTP_X_REQUESTED_WITHを見れば分かるみたい。サーバーサイド（PHP）のサンプルコードは下のような感じ。 /** * Ajaxによるリクエストかどうか * * @return boolean True or False */ public function isAjax() { if(isset($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest'){ return true; } return false; } これで判断できるのはjQueryがajax通信をするときのリクエス
HTMLフォームで入力チェック後、戻る方法について - OKWAVE
具体的には、フォームのaction属性に指定するPHPファイルで入力チェックを行い、戻って表示する方法を知りたいです。 入力チェックで戻る場合、PHPファイルで入力チェックを行い、エラーがあればエラーメッセージを表示し、正常な場合は指定したHTMLファイルに戻って表示することができます。 htmlのフォームactionからphp側で入力チェックを行った場合 下記のようにすると別ページに表示されますが、html側に戻って 表示するにはどのように行えばよいでしょうか。 ---html--- <form action="abc.php" method="post" > <input type="text" name="ord[name]" size="30" VALUE=""> <input type="submit" name="button_confirm" value="確認画面" />
Yahoo! UI Library 3（YUI3）の基本
「Yahoo! User Interface Library Ver.3」（YUI3）はYahoo!が開発した、Webのページを作成するための汎用ツールライブラリーです。オープンソースで無償で提供されており、アニメーション効果やドラッグ＆ドロップ、データ取得やイベントの応答など、多岐にわたる機能がサポートされています。今回はまずYUI3の全体像を紹介します。 はじめに Yahoo!は、米国時間9月29日に「Yahoo! User Interface Library Ver.3」（YUI3）をリリースしました。YUI3はJavaScriptやCSS（Cascading Style Sheet）で書かれた、Ajaxライブラリーです。 Yahoo!は今まで、インターネットによる情報提供のためのさまざまなツールを作成してきました。開発したツールの中でも、Webのページを作成するのに汎用的に使えるツ
site.oukasei.com – このドメインはお名前.comで取得されています。
このドメインは お名前.com から取得されました。 お名前.com は GMOインターネット(株) が運営する国内シェアNo.1のドメイン登録サービスです。 ※表示価格は、全て税込です。 ※サービス品質維持のため、一時的に対象となる料金へ一定割合の「サービス維持調整費」を加算させていただきます。 ※1 「国内シェア」は、ICANN(インターネットのドメイン名などの資源を管理する非営利団体)の公表数値をもとに集計。gTLDが集計の対象。 日本のドメイン登録業者(レジストラ)（「ICANNがレジストラとして認定した企業」一覧（InterNIC提供）内に「Japan」の記載があるもの）を対象。 レジストラ「GMO Internet Group, Inc. d/b/a Onamae.com」のシェア値を集計。 2024年5月時点の調査。
Javascriptで開いた子画面から親画面の関数を呼び出す
Javascriptで開いた子画面（ポップアップウィンドウ）から、親画面の関数を呼び出します。 子画面から親画面を操作するにはwindow.openerを使う Javascript子画面から親画面を操作するにはwindow.openerを使います。 それを応用すると子画面から親画面の関数や変数が利用できるようになります。 (親画面のソース） <html> <head> <script language="JavaScript"> function parentFunc(myname) { var innerObj = document.getElementById( "my_name" ) ; innerObj.innerHTML = "私の名前は" + myname + "です。" } function childDsp() { window.open( "子画面のURL", "chil
お手軽データバインディングライブラリ「Vue.js」を使いこなそう（基礎編）
はじめに Vue.jsは、シンプル・軽量・高速という特徴を持つデータバインディングライブラリとして最近注目を集めています。LINE社でもアプリ内WebViewの実装技術の選択肢の一つとしてVue.jsを採用しています。2014年11月27日にリリースされたLINEスケジュールは、Vue.jsを使って実装しているSPA（Single Page Application）の代表例です。 本稿は日本語記事がまだ少ないVue.jsの基本機能の紹介を目的とした「基礎編」として、公式ドキュメントの内容を元に解説します（執筆時点のバージョンであるv0.11の内容です）。 Vue.jsとは Vue.jsは、双方向バインディングによるModelとViewをつなぐ仕組み「ViewModelレイヤー（MVVMパターン）」を提供するJavaScriptのライブラリです。 Vue.jsの基本概念は以下のようになってい
AngularJSで、入力フォームを簡単にチェックできるディレクティブを使う
対象読者 jQueryなどを使っている開発者 JavaScriptを使った複数人でのプロジェクトに参加している方 JavaScriptを使ってサーバ等と連携したフロントエンドの開発をしている方 必要な環境 この記事では、AngularJSを使用し、Chrome（39.0）、IE11、Firefox（35.0）、Safari（8.0.2）の環境にて確認を行っています。 入力フォームを扱うためのディレクティブ FormやInputタグなどフォームを扱うディレクティブでは、ユーザから入力される値を管理するために表示するだけのディレクティブとは異なり、便利な機能が沢山あります。それらの機能をうまく使うことで手間なく、また、問題がおきにくいシステムを構築できるようになっています。まずは、このフォームを扱うための機能を紹介します。 フォームの管理を扱うためのディレクティブ ngForm/ngSubmi
jQuery入門講座：クッキーの操作
索引 └ プラグイン目次 1章：小ネタ系 ├ イージングの追加 ├ 要素のセンタリング ├ クッキーの操作 ├ マウスホイール ├ スクロールバー(1) ├ スクロールバー(2) ├ スクロールバー(3) ├ スクロールバー(おまけ) └ アニメの一時停止/再開 2章：ショーケース系 ├ Nivo Slider(1) ├ Nivo Slider(2) ├ Nivo Slider(3) └ Nivo Sliderの改造 3章：カルーセル系 ├ carouFredSel(1) ├ carouFredSel(2) ├ carouFredSel(3) ├ carouFredSel(4) ├ carouFredSel(5) ├ スマホでカルーセル(1) ├ スマホでカルーセル(2) ├ カルーセルとnivo(1) ├ カルーセルとnivo(2) ├ カルーセルとnivo(3) └ カルーセルとniv
【jQuery】外部ファイルの読み込みと操作 - MAXIMUM.PROの日記
今回は、外部ファイルの読み込みと操作、GETメソッドを使ったファイルの扱い方を中心に紹介していきます。APIを使ったWebアプリケーションをつくる際に必要になってくるJSON形式について覚えましょう！！ 以下のファイルを用意してください。 sample.html <h2>load</h2> <p>外部ファイルのテキストデータをそのままタグに置き換える</p> <!-- javascript:void(0)：リンク表示、アクションは起こさない --> <div><a id="load" href="javascript:void(0)">読み込み</a></div> <div id="txtLoad">データ</div> <br /> <p>外部ファイルのHTMLデータをそのままタグに置き換える</p> <a id="load2" href="javascript:void(0)">読み込み
load( url, data, callback ) - jQuery 日本語リファレンス
HTMLを読み込み、DOMに挿入します。 デフォルトはGET通信ですが、追加のパラメータを設定すればPOSTでも可。 jQuery1.2ではURLの中でjQueryセレクタを使用可能で、これによって結果の中からセレクタにマッチする要素のみ取り出して挿入することが可能です。書式は、例えば"url #id > セレクタ"のようになります。詳しくは下記のサンプルを参照のこと。
クッキーの使用方法 | JavaScript プログラミング解説
JavaScriptのクッキーはString型であり、ただの文字列です。よってこれを処理する専用のメソッドは存在しないため、文字列を処理するメソッドを使用して読み書きします。そしてクッキーはHTMLDocumentのプロパティとして実装されているため、document.cookieからアクセスできます。 書き込み クッキーを受け入れないようにブラウザで設定されている場合には、クッキーを書き込むことはできません。 クッキーに書き込むには[名前=値]の形式で、documentのcookieプロパティに設定します。具体的には、 document.cookie = 'data1=123'; document.cookie = 'data2=abc'; のようにします。複数の項目を書き込むには、くり返しcookieプロパティに設定します。このように書き込んだクッキーは、 data1=123; dat
JS自動レビューツール"jswatchdog"を公開しました - Cybozu Inside Out | サイボウズエンジニアのブログ
こんにちは。kintone 開発チームの天野 (@ama_ch) です。すっかり春らしくなりましたね。 少し前に JS の自動レビューツール jswatchdog をオープンソースで公開しましたので、こちらで紹介させていただきます。 使い方 https://kintone.github.io/jswatchdog/ 上記の URL を開き、左側のエディタに JS コードを貼り付けるだけです。 右側に修正が必要な箇所が表示されるので、適宜修正します。 特徴 バリバリの開発者じゃなくても使いやすい一画面完結の Web インターフェース lint ツールでお馴染みの構文チェックの他、知らずに脆弱性を作り込むことを避けるため、XSS の可能性がある箇所にも警告を表示 内部的には、JS の静的構文チェックツールとして ESLint と JSHint を組み込んでいます。 さらに XSS の可能性があ
jQuery UIのDraggableで快適なドラッグアンドドロップライフを！ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは。づやです。 さて、要素をドラッグアンドドロップさせてなんかしたいっていう要望は割とあると思うのですが、個人的には5年くらいその処理が必要とならず、あまり考えることがありませんでした。 そこで最近はどんな感じでできるのかなあ、と思っておりまして、ちょっと調べてみたことをまとめます。 5年前はprototype.jsとプラグインを利用していたのですが、今回はjQueryとプラグインで実装してみたいと思います。 便利なjQuery UIのDraggableを利用します と言っても、jQuery UIを利用すれば超簡単にできる模様なので、まずは作ってみました。 ※コードは大事な所だけ抜粋しています <html> <head> <!-- まずjQueryとjQuery UIを読み込みます。今回はCDNから読み込んでます --> <script src="//ajax.googleapis
jQuery UIのDatepickerでカレンダーから楽々日付入力
フォーム入力で日付を扱うことあると思いますが、数字だけの割にはいろいろと制御が面倒な部分でもあります。 入力フォーマット、年・月・日の制御など、作る側としてはかなり見えない部分の仕事が増えます。 入力するユーザの立場としても、フォームがドーンとあっただけでは入力に迷いますし、こういう局面ではカレンダーなどで曜日や日にち間隔を確認しますよね。 この両者の不便さを解消する方法として、jQueryのプラグインである「jQuery UI」の１機能、「Datepicker」で解消できます。 Datepickerを使用することで、フォームへの日付入力の際、カレンダーを表示して入力補助をするインターフェースを、簡単に実装できます。 jQueryを用意するjQuery UIはjQueryのプラグインであるため、jQuery本体が必要となります。 jQuery本体の準備は以前「「CrossSlide」写真や
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
【jQuery】セレクトボックスの選択要素を抽出 - Qiita
Learn web development | web.dev
