jQueryを使って、
textArea input text
にセットされている文字列を取得したい場合に、
text() val()
のどっちの関数を使えば良いのか良く迷う。
例えば以下のような例だ。
<body>
<script>
window.onload = function () {
var inputText = $('<input type="text" />');
var textArea = $('<textarea />');
$('body').append(inputText);
$('body').append(textArea);
inputText.val('inputTextの初期値');
textArea.val('textAreaの初期値');
var text1 = $('body > input[type="text"]').val();
var text2 = $('body > input[type="text"]').text();//空文字列
var area1 = $('body > textarea').val();
var area2 = $('body > textarea').text(); //でも良い
var CRLF = '\r\n';
var msg = 'text1 val() =' + text1 + CRLF
+ 'text2 text()=' + text2 + CRLF
+ 'area1 val() =' + area1 + CRLF
+ 'area2 text()=' + area2 + CRLF
;
alert(msg);
};
</script>
</body>
まず、二つの要素をbodyに追加する。
var inputText = $('<input type="text" />');
var textArea = $('<textarea />');
$('body').append(inputText);
$('body').append(textArea);
追加した要素に初期値を与える
inputText.val('inputTextの初期値');
textArea.val('textAreaの初期値');
値をセットする場合はval()で行う。
ここでセットした値がそれぞれの要素に表示される。
一方、値を取得する場合も、val()で行うと良い。
var text1 = $('body > input[type="text"]').val();
var area1 = $('body > textarea').val();
これで正常に値を取得出来た。
一方、text()メソッドを使うと、
var text2 = $('body > input[type="text"]').text();//空文字列
var area2 = $('body > textarea').text(); //でも良い
textAreaのほうは同じく正常に値を取得出来たが、input textのほうは空文字列が返ってきた。
なので、結論としては、textArea, input textのどちらの場合も値の設定・取得には
val()
を使えば十分。
本を読む
アマゾンのランキングが高いので、良い本なのかもしれない。
本日現在では、Kindle版だと450円だ。
安いな。272ページもあるのに。
ワテはまだ読んでいない。
Web開発本の売れ筋ランキング
コメント