- ベストアンサー
jqueryでtextareaのcols、rowsの属性を設定する
javascriptでDOMでtextareaを多数発生させているのですが、その発生したtextareaのcols属性とrows属性をjqueryを用いて設定したいです。 どのようにしたらいいのかわかりません。 教えて下さい。
- eccschool
- お礼率8% (53/644)
- JavaScript
- 回答数2
- ありがとう数0
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
その他の回答 (1)
- x_jouet_x
- ベストアンサー率68% (162/236)
jQueryのattr(key, value)メソッドを使用します。 以下、DOMでtextareaを作成してjQueryを用いてcols属性とrows属性を設定する一例です。 ---------- var textarea = document.createElement("textarea"); $(textarea).attr("cols", "50"); $(textarea).attr("rows", "10"); ----------
補足
うまくいきません・・。 textareaにはcolsもrowsも記述していません。 <textarea name="hoge1"></textarea> <textarea name="hoge2"></textarea> ・ ・ ・ <textarea name="hoge10"></textarea> という形でボタンを押すごとにDOMで生成されます。 このcols、rowsをjqueryで設定したいです。 すみませんが教えてください。
関連するQ&A
- textarea内のname属性について
ブログスキンをコーディングする仕事をしておりまして 元の部分で下記のような箇所があるのですが <textarea name="comment" rows="10">{コメント記入欄}</textarea> このうち name="comment" が入ると textarea内にcols=""を入れても前後にclass属性を追加して width指定しても横幅が全く効いてくれず困っています。 コメントを記入しているとたまに一瞬幅が伸びるのも気になります。 name="comment"をname="comments"に変えてみたところ、 width指定で横幅が変わったのでシステム内部で 横幅を指定しているとしか思えないのですが うまく検索できず、指定している箇所が出てきません。 もともとname属性もほとんど使用したことがないので この予想もあっているのかよく分かりません。 そこで質問なのですが、 (1)name属性はidやclass同様にcssの装飾ができるのでしょうか (2)(1)でcssが指定できる場合、name属性の 指定側のcssの指定先頭の記号は何でしょうか （idなら#、classなら.というものです) お手数ですがどうぞよろしくお願い致します。
- ベストアンサー
- HTML
- JavaScript内でエレメントを設定したいがPHPが間にある場合
html(phpファイル内)抜粋 textarea name='textRmks["+nextRow+"]' cols='100' rows='5'><?=$teststr;?></textarea> これをJavascript内でエレメントを使って設定したいのですが PHPの<?=$teststr;?>部分の書き方がわからずだいぶ悩んでます。 var ipt = fm.createElement("<textarea name='tRmk["+cnt+"]' cols='100' rows='5'><--ここ？-->"); どなたか教えてください。
- ベストアンサー
- JavaScript
- textareaについて
textareaに400文字の感想を入力してもらいたいのですが、400文字以上入力することを考え,inputタグと同様にmaxlenght="400"としたいので、400文字以上入力されてしまいます。 <TEXTAREA name="comment" COLS="50" ROWS="5" maxlength="400"></TEXTAREA> textareaではmaxlenghtは効果ないのでしょうか？
- ベストアンサー
- HTML
- <textarea>に横のスクロールをつけたいのですが，可能ですか？
こんにちわ， 今HTMLを書いているのですが, <textarea></textarea> タグで，入力していくと縦のスクロールバーは自動的にできるのですが,横のスクロールとかをつける事は可能なのでしょうか。 ちなみにRows Colsオプションとかでも,javascript等を使用したり，他のタグで同様な事を実装できるならそれでもいいのですが,知っている方， よろしくおねがいします。
- ベストアンサー
- HTML
- rowsとcolsの意味
textareaタグとかに出てくるrowsとcolsについて悩んでいます。 どちらかが行でどちらかが列というのは分かるのですが・・。 和英辞典で列と行について調べてみると両方ともでrowが出てきて混乱してしまいました。 cols="20" rows="10"と指定したら横20縦10文字分確保するという風に理解してしまって良いのでしょうか？ 後colsって何かの英単語の略なのでしょうか？
- 締切済み
- HTML
- TEXTAREAについて
<TEXTAREA cols="100" rows="100" name="edits"> </TEXTAREA> で端までいくと自動的に改行されてしまいます。 これを横スクロールバーを表示して改行させない方法を教えて頂けないでしょうか。 以前の質問で強制的に改行させる方法として wrap を使用するというのがあったので、 nowrap を入れてやってみたのですが、 うまくいきませんでした。 style="overflow-x: scroll;" も試したのですが、 うまくいきません。 よろしくお願いします。
- ベストアンサー
- HTML
- textareaの幅を画面と合わせたい
HTMLのテキストエリアで画面サイズに合わせたいのですが、 何か方法はないでしょうか。 お知恵を貸してください。 <textarea name="addtext" cols="35" rows="25"></textarea> これだと固定になってしまいます。 <textarea name="text" width=30% height=100%></textarea> イメージ的にはこんなことをしたいのです。
- ベストアンサー
- HTML
- textareaについて
textareaのタグを使って現在下記のようなものを作ったとします。 この場合ファイルの文章中に記述していくため、項目が増えると ＨＴＭＬ自体が長く、先が見にくいかたちになってしまいます。 そのため1000～4000の部分は別ファイルとして提供（この場合 テキスト形式でも、ＨＴＭＬ形式でもいいですが） したいと思うのですが、そのようなことは可能でしょうか？ textareaタグに限らなくても良いのですが、このような方法を ご存じの方は教えて下さい。 （出来るだけＨＴＭＬのタグの範囲がいいかな？） <textarea name="kiriban" rows="2" cols="50" wrap="off"> 4000 ××さん 3000 ●●さん 2000 △△さん 1000 ○○さん 500 □□さん </textarea>
- ベストアンサー
- HTML
- textとtextareaの書式に設定について
先日、質問をさせて頂きました者になります。 input textとtextareaの書式の設定制御の方法が、 分からなくなってしまい質問をさせて頂きました。 【やりたい事】 textやtextareaの初期値のテキスト色とバックグランの色を、 textやtextareaに初期値が入っている時と入力した値が入っている時に、 指定した書式に各種設定したいと思っています。 具体的には、textやtextareaに初期値が入っている時には、 初期値の文字を薄いグレー色に設定し、バックグランドをピンク色に設定し、 textやtextareaに入力をした値が入っている時には、 入力した文字を黒色に設定し、バックグランドを白色に設定したいと思ってます。 ご教授頂ければと存じます。 よろしくお願いいたします。 【ソース】 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN Frameset" "http://www.w3.org/TR/html4/frameset.dtd"> <html> <head> <script type="text/javascript"> <!--ログ生成スクリプトを取得--> function textoutput(formObj) { <!--text01を取得--> if((text01 = formObj.elements["text01"].value)==formObj.elements["text01"].defaultValue)text01=""; <!--text02を取得--> if((text02 = formObj.elements["text02"].value)==formObj.elements["text02"].defaultValue)text02=""; <!--textarea01を取得--> if((textarea01 = formObj.elements["textarea01"].value)==formObj.elements["textarea01"].defaultValue)textarea01=""; <!--textarea02を取得--> if((textarea02 = formObj.elements["textarea02"].value)==formObj.elements["textarea02"].defaultValue)textarea02=""; <!--出力データを作成--> var text = ''; <!--text3データを作成--> if(text01!==""){ text += '質問1：' + '\n'+ text01 + '\n'; } <!--text2データを作成--> if(text02!==""){ text += '質問２：' + '\n'+ text02 + '\n'; } <!--textarea01データを作成--> if(textarea01!==""){ text += '質問３：' + '\n'+ textarea01 + '\n'; } <!--textarea02データを作成--> if(textarea02!==""){ text += '質問４：' + '\n'+ textarea02 + '\n'; } <!--出力データを作成--> formObj.elements["output"].value=text; } </script> </head> <body> <form name="form01"> <strong>・諮問１：</strong><br> <input type="text" name="text01" value="１入力してください" id="p1" size="30" class="disabled" onfocus="if (this.value == defaultValue) this.value = '';" onblur="if (!this.value) this.value = defaultValue;"><br> <strong>・諮問2：</strong><br> <input type="text" name="text02" value="2入力してください" id="p2" size="30" class="disabled" onfocus="if (this.value == defaultValue) this.value = '';" onblur="if (!this.value) this.value = defaultValue;"><br> <strong>・諮問3：</strong><br> <textarea name="textarea01" id="textarea01" cols="60" rows="5" onfocus="if(this.value == this.defaultValue) this.value=''" onblur="if(this.value == '') this.value=this.defaultValue"> ３入力してください </textarea><br> <strong>・諮問4：</strong><br> <textarea name="textarea02" id="textarea02" cols="60" rows="5" onfocus="if(this.value == this.defaultValue) this.value=''" onblur="if(this.value == '') this.value=this.defaultValue"> ４入力してください </textarea><br> <strong>・出力結果：</strong><br> <input type="button" value="ログ出力" onClick="textoutput(this.form);"> <br> <textarea cols=60 rows=20 name="output" id="output"></textarea><br> <textarea id="text" cols="30" rows="5" wrap="soft"></textarea><br> <button onclick="save();">save</button><a id="anchor" href=""></a> </form> </body> </html>
- ベストアンサー
- JavaScript
- jQueryでの書き方について
HTMLファイルから読み込まれるJavaScriptファイルに次のような書き方がありました。 (function($){ $(function(){ // DOM操作などの処理を記述 ... ... }); })(jQuery); このような書き方を初めて見たのですが、これはどのような意図があるのでしょうか？ HTMLの読み込みが完了してから処理を始めるように、次のような書き方はよく見るのですが、これとは何が違い、どう使い分けるのでしょうか？ $(function(){ // DOM操作などの処理を記述 ... ... }); ■環境 jQuery 2.1.3
- ベストアンサー
- JavaScript
補足
ご返答有難うございます。 DOMでtextareaを生成させているところで、 textarea.setAttribute("cols", "50"); で設定できました。有難うございました。 すみません。