textarea改行不可

Question

あるjqueryをベースに制作しておるサイトについてですが、textareaを設定しても、複数行に改行して入力することができずに困っております。（テキスト入力時、Enterキーを押しても改行されない）CSS、javascript など、わかる範囲で調べましたが、原因不明です。どこに問題があるか、アドバイスをお願いします。

Answer

ECマスターズの田中です。原因を探るためには、実際のページを確認させていただく必要がございますので、該当ページのURLを、返信もしくは「投稿内容について報告する」よりお知らせいただきますようお願いします。

Answer

田中様ありがとうございます。先ほど、「投稿内容について報告する」から連絡致しました。ご回答、お待ちしております。

Answer

ECマスターズの田中です。いただいたページのソースを確認したところ、JavaScriptによって、ページ全体でF5キーおよびEnterキーの入力が妨げられていることがわかりました。「design.php」より出力された、下記のソースです。= この下の行から ====================   $(window).on('keydown', function(e) {      // F5,enterを抑制        if( e.type == 'keydown' && (e.which && e.which === 13) || (e.keyCode && e.keyCode === 13) || (e.keyCode && e.keyCode === 116)  ) {            return false;        }    });= この上の行まで ====================上記ソースの中で(e.which && e.which === 13) || (e.keyCode && e.keyCode === 13)が、入力されたキーがEnterかどうか判定する部分となっておりますが、おそらく、入力途中のフォーム誤送信や、想定外の改行入力を防ぐ意図で設置されている仕組みだと考えられます。この条件を外すことで、誤動作や表示乱れなどが発生する可能性がございますので、実際に外す前に、テスト環境などご用意の上、十二分に動作確認を行っていただきますようお願いします。

Answer

田中様、ありがとうございます。該当箇所をコメントアウトすることで、改行できるようになりました。今回の改行できなかったtextareaのすぐ上に既にinput （テキストボックス）があります。操作すると、そのテキストボックスに、テキストエリア内に入力した文字が表示されると思いますが、テキストボックスの為、１行になってしまいます。その部分も、テキストボックスで表示させたいと思います。単純にinput ではなく、 textarea に打ち換えても、うまく進みませんでした。併せて、ローカル内で、input[type="text"]を検索し、var insert_text = document.querySelectorAll('#borad input[type="text"].insert-text');を、var insert_text = document.querySelectorAll('#borad textarea.insert-text');に変更してもうまく進みません。ご指導お願いいたします。

Answer

ECマスターズの村井です。休み明け担当より返答いたしますので、お時間いただきますが、少々お待ちくださいませ。

Answer

ECマスターズの田中です。同じくdesign.phpの中で読み込まれておりますfontItem.jsの中にも、同じセレクタ#borad input[type="text"].insert-textの記述がございますので、まだ変更されていない場合は、こちらの変更もお試し願います。変更前後、どちらにも対応できるよう#borad .insert-textへご変更いただくことをお勧めします。（insert-textクラスが複数存在しないことをご確認の上、ご変更ください）

Answer

ありがとうございます。#borad input[type="text"].insert-textを、検索し、すべて　#borad .insert-text　に変更しました。投稿時点で、変更後の状態です。操作していただくとお分かりかと思いますが、途中読み込みが終わらず、うまく進みません。よろしくお願いいたします。

Answer

ECマスターズの田中です。「この商品のデザインを作成する」ボタンを押した直後に途中読み込みが終わらなくなる、という状態でよろしいでしょうか。私にて状況を確認したところ、同じ状態になったのですが、ページの再読み込みを行うと無事動作するようになりました。・スーパーリロードを行うhttps://liginc.co.jp/web/tool/browser/47339・プライベートブラウズ（シークレットモード）を利用するhttps://support.google.com/chrome/answer/95464 （Google Chromeの場合）・ブラウザの設定画面から、キャッシュを削除する・普段ご利用されているブラウザ以外のブラウザ・PCで表示など、お試しいただきますようお願いします。

Answer

田中様、ありがとうございます。＞「この商品のデザインを作成する」ボタンを押した直後に＞途中読み込みが終わらなくなる、＞という状態でよろしいでしょうか。そうですね。その状態です。キャッシュクリアして、シークレットモードでスマホ（Android）で確認しましたが、状態は変わらずです。だと、スムーズに読み込み、だと、読み込みが終わらない状態です。

Answer

【補足】 $('#borad .insert-text').on('input keyup',function(){を $('#borad .insert-text').on('textarea keyup',function(){へ修正したところ、スムーズに読み込みが行われます。この記載方法には間違いないでしょうか。

Answer

ECマスターズの田中です。

Answer

ありがとうございます。on('input に戻し、スムーズに読み込みがされます。理想通りになりました。ありがとうございました。

textarea改行不可

カテゴリーから探す