服务器错误 404 - 找不到文件或目录。 您要查找的资源可能已被删除,已更改名称或者暂时不可用。 XML 地图
服务器错误 404 - 找不到文件或目录。 您要查找的资源可能已被删除,已更改名称或者暂时不可用。 XML 地图
入力された値の検証は最終的にサーバ側で行わなければ意味がない。が、ユーザビリティを考えるとブラウザ上でチェックし、通知できれば便利に違いない。問題はそうしたチェック機能を実装するのが手間だと言うことだ。 jQueryを使ってWebブラウザ上で入力チェック 動的なフォーム生成でも柔軟に対応できるくらいシンプルな入力チェックライブラリがjQuery Inline Form Validation Engineだ。 今回紹介するオープンソース・ソフトウェアはjQuery Inline Form Validation Engine、jQueryプラグインで提供される入力チェックライブラリだ。 jQuery Inline Form Validation Engineの良い点は、入力チェックがブラウザ上で行われ、かつそのエラー内容が入力項目の横にフローティングで表示される所だ。吹き出し風になっており、非
こんばんは、最近ホルモン焼きにハマっているishidaです。 WEBサイト制作時、formは必ずといってもいいぐらい存在します。 お問い合わせフォームや会員登録フォームなどがすぐに思いつきますよね。 デザインをがっつりフォーム部分で作り込んでも、CSSのみでは、 実現できなかったりすることもよくあります。 そんなクセのあるformを、よりリッチに!かつ操作性を向上!できるjQueryプラグインの数々をご紹介します。 デザイナーの方は、フォームのデザインの参考に。 コーダーの方は、ページ作成時間の短縮に手助けになればと思います。 jQuery plugin: Validation フォームの入力チェック(バリデーション)が簡単にできるプラグイン。 エラーメッセージはlocalizationディレクトリ内に18言語用意されています。 日本語用は別途作成し、使用することが可能です。 jQuery
demo: video こういったユーザーに少しでも集中してほしいコンテンツには、効果が高そうです。 使用方法も簡単で、JSファイルを外部ファイルで指定し、スクリプトで適用箇所とカラーと不透明度を指定します。 最小の記述だと、下記のようになります。
いろんな文献を気軽に参照しにくい環境になり、いちいち検索しなくてもいいようにここにまとめておきたい感じになったのでしばらくそんな普段書かないようなPOSTばかりします。 まず、最近良くある、デフォルトの状態では入力例を表示して、フォーカスを合わせると消えるというインプットボックスの実装例について。このブログのコメント入力フォームがまさにそんな感じ。 <form action="hoge.php" method="get"> <p><input type="text" name="q" id="q" size="30" value="検索語を入力してください"><input type="submit" value="検索"></p> </form> $(function(){ $("#q").focus(function() { if($(this).val() == $(this).att
select選択ボックスを動的に作る † JavaScriptで、こんな感じの、選択肢が動的に変わる選択ボックス作るサンプルです。 最初に選んだ選択ボックスによって、次の選択ボックスの選択肢が変わります。 解説 フォームの<select>+<option>タグで作った選択ボックスは、 Selectオブジェクトという種類のオブジェクトになります。 Selectオブジェクトは、optionsという選択肢の配列を持っています。 これにアクセスすることで、動的に選択肢の内容を変えることができます。 selectオブジェクト(選択ボックス)を取得するには、 タグで<select name="選択ボックス名" 〜で名前をちゃんとつけて、 form name="フォーム名" で名前をちゃんとつけて、 フォーム名.elements["選択ボックス名"] または フォーム名.選択ボックス名 で
Custom Checkboxes, Custom Radio Buttons, Custom Select Lists This JavaScript and CSS will allow you to use custom images for checkboxes, radio buttons and select lists. Checkboxes, Radio Buttons, Select Lists, Custom HTML Form Elements Have you ever wanted to use your own images for checkboxes, radio buttons or select lists? This script will let you do that. Easily. The unobtrusive script graceful
Q - なぜ、全国地図にしないのですか? 4つほど理由があります。 ポップアップが場所をとりすぎるから 現在、地図部分は185x120pxにおさめていますが、標準的なモニタ解像度ではこの辺が限界です。 キーボード操作時の押下回数を減らすため jsmapがフォーカスするのはSugarCRMなどのWEBアプリです。使い切りのWEBフォームと違い、慣れによるスピードアップが望めるUIである必要があります。 多言語対応のため 日本は47都道府県なので、かろうじて可能だと思う方もいるかもしれませんが、これがイギリス(現在製作中)とかでは100を超えます。 認知的限界のため これも重要。ぱっと見て探せる数というのは、15や20がせいぜいです。 ただ、上記の話とは別に、地方選択用の全国図はあってもいいと考えていますので、それは将来のバージョンで。 Q - 地図はもっと詳細化/単純化しないのですか? 詳細
もう2年ほど前に話題になったアレなんですけど、今更ながらあるサービスでこの仕組みの導入を検討しています。 onsubmit で submit ボタンを disable にしてユーザビリティを良くする - naoyaのはてなダイアリー submit ボタン disable 技の罠 - naoyaのはてなダイアリー onsubmit で submit ボタンを < disable にしてユーザビリティを悪くするのはやめてください - のヮの うんこ♥ onsubmit で disable にするやつ - 鷹の島 onsubmit の disable 化ですが既に議論が終わっているように、onsubmit disable の実装方法として、 onsubmit イベント発生時に submit 要素を disable にして値をサーバへ渡すための hidden 要素を生成する方法 setTimeou
Form field hints with CSS and JavaScript (Ask the CSS Guy) My co-workers pointed out a nice effect on the Vox registration form. 入力フィールドにカーソルを合わせた際に吹出しヒント表示するCSS&JavaScriptサンプル。 次のように、入力フォームにカーソルを合わせた時点でそのフィールドのヒントを表示できます。 フォームの入力フィールドの下に説明を書くよりも、ポップアップしてヒント表示したほうがユーザビリティ的によさそうですね。 要素の表示/非表示処理をJavaScriptによって行っていて、綺麗なHTMLによる実装が可能な点もいいです。 また、サンプルが1ファイル+画像1枚とシンプルなので、あまりJavaScriptやCSSの知識のない方でも、ちょこっと変え
JavaScriptでフォームの値をリアルタイムにバリデートするライブラリまとめ。 バリデートするライブラリも沢山でてきました。とここら辺で一度まとめておきました。 Really easy field validation (デモ) - 入力値がおかしいと、エラーメッセージをフェードインさせながら超クールに表示できます。 ※ ページの最後で使い方紹介(これは良いです) Remember the milk風の登録フォームも作れそう prototype.js依存。 Realtime validation using Ajax (デモ) - Ajaxなどを駆使して、入力値を動的にチェックするライブラリ Validate.js (デモ) - リアルタイムではないけど、入力値をチェックするためのライブラリ Tooltip for forms - 入力チェックではないけど、フォームの入力ヒントを出して
IE 上で動くスクリプトは、通常は JavaScript となります。インターネット全体で言えば、ブラウザが IE であるとは限らず、OS ですら Microsoft Windows であるとは限りません。ですから、アプリケーションの「エンドユーザ」の環境を一般的に考えるのならば、JavaScript を使用するのが正しい設計と言えます。 しかし、アプリケーションはそもそもインターネット専用のものでは無く、「エンドユーザ」に対して提供するものですから、その環境が 「Windows の IE を使用します」という前提で成り立つ場合もあります。そのような場合は、VBScript を使用したほうが Microsoft の環境下の利点を大いに活用する事ができますし、細かなコントロールは、VBScript のほうが容易で優れている場合が多く、他のシステム ( VB, ASP WSH 等 ) の資産を
Forms needs a solid visual structure, a profound hierarchy of form elements (Fields and Labels), powerful techniques and Functionality (AJAX) to make the form look and work creatively. There is a great bunch of creative, outstanding and individually designed from scratch forms. Thanks to AJAX, we can provide real-time feedback to our users using server-side validation scripts and eliminate the nee
このスクリプトに機能を追加した valueconvertor.js を公開しています。アーカイブとしてこの記事は残してありますが、この replaceascii.js 機能をご利用する場合は、より安定している valueconvertor.js のご利用をおすすめします。 概要 フォーム入力時に『半角英数で入力してください』の項目があった場合、ユーザの入力ミスを少なくしてあげるために便利なスクリプトです。 ただし、JavaScript が使えない環境では動作しませんので、あくまでもオプションとしてお使いください。 動作確認用の DEMO ダウンロード 使い方 ダウンロードした replaceascii.js を XHTML ファイルの head 要素内などで読み込んでください。 このとき、replaceascii.js と読み込む XHTML ファイルの文字コードが同じになるようにしてくだ
[上に] [前に] [次に] seltza 1998/04/10(金) 16:57:09 <SELECT>のプルダウン式の選択メニューがあったときに、JavaScriptで その中の項目の選択を変更するのってどうやってやります? だれかお教え下さい。 とほほ 1998/04/11(土) 00:00:48 <FORM NAME=form1><SELECT NAME=sel1>とすると、 document.form1.sel1.selectedIndex = 3; でできます。 NN2,NN3,NN4,IE4では動作確認しました。 seltza 1998/04/13(月) 11:30:05 [[解決]] とほほさん。どうもありがとうございました。 試してみましたところ、何とかうまくいきました。 動作確認したHTMLで、<SELECT>のNAMEに"name"としていたため最初どうやってもうまく
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く