【Jquery】コメント機能などにCtrl+Enterでフォームを送信する機能を追加してみた

自分の運営サイトには、ユーザー同士で連絡が取りあえるように、「コメント機能」を設けています。

そのコメント機能に、「Ctrl+Enter(コントロール+エンター)でコメントが送信できるようにしてほしい」という要望が数件来ていました。

Ctrl+Enterで送信は、TwitterなどのWEBサービスでも実装されている機能ですね。

今の自分のサイトは、マウスで送信ボタンを押してもらうしかないので、キーボードだけでコメント送信が完結せず不便な状態です。

調べてみたら、Jqueryを使用することで意外と簡単に実装できたのでこちらで公開したいと思います。

(実はまだサイトには実装していませんコメントくれた方ごめんなさい…次の更新時に盛り込みます)

スポンサーリンク
レクタングル(大)

コメント送信機能のソースコード

HTMLのソースコード

 JavaScript(Jquery)のソースコード

テキストエリアが選択されている状態で、キーダウンのイベントを発火した時の処理です。

その際にコントロールキーとエンターキーが同時に押されているか&コメントには何か入力されているかを判定しています。

そして、それらの処理がすべて通ったら送信。

簡単に実装できる上に、ユーザーインターフェースの向上に繋がるので追加したほうがいい機能だと思います。

実際にこれを実装しているサイトは「分かっているサイト」と呼ばれているとか。

自分も近いうちにこれを導入しないと…。

スポンサーリンク
レクタングル(大)
レクタングル(大)

フォローする