jQueryでtextareaの値やテキストボックスの値を取得するサンプル

jQueryで要素を指定する

jQueryは多くのセレクタをサポートしていて、セレクタに適合した要素が指定の対象となる。
これはCSS セレクタの例。CSSっぽく要素を指定することができる。

名称	指定の対象	書式など
型セレクタ	同じ名前の要素	$('div);とか$('a');
IDセレクタ	同じID属性を持つ要素	$('#main');とか$('div#main');
クラスセレクタ	class属性に指定した文字列を含む要素	$('.header'),$('div.top')など
属性セレクタ	属性名と値	label[for=""comment""]

jQueryでtextareaの値やテキストボックスの値を取得する。

以下のサンプルで、テキストボックスの値を取得してコンソールに出力してみる。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jQueryで属性を設定するサンプル</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
	$('form').submit(function(e) {
		e.preventDefault();
		textValue = $('textarea').val();
		console.log('textareaの値↓');
		console.log(textValue);
		console.log("------------")
		nameValue = $('#name').val();
		console.log('名前は・・・↓');
		console.log(nameValue);
		console.log('---------------');
		console.log("valの一覧");
		$(this).find('ul')
			.find(':input')
			.each(function() {
				var val = $(this).val();
				var name = $(this).attr('name');
				//console.log(name.text());
				var li = $(this).attr('li');
				console.log(val);
			});
			console.log("-------");
	});
	$(this).unbind('submit');
});
</script>
</head>
<body>
<h1>ご登録</h1>
<form action="#" method="post">
<ul>
<li>名前:<input type="name" type="text" id="name"></li>
<li>選択してください。
<select name="select">
	<option>男</option>
	<option>女</option>
</select>
</li>
<br>
<li>
何かメッセージを入れてね:<br>
<textarea name="textarea" rows="3" cols="50">
</textarea>
</li>
</ul>
<br>

<input name="submit" type="submit" value="送信">
</form>
</body>
</html>

結果はこうなる。

textareaの値↓ 
hello world!
------------ 
名前は・・・↓ 
sho322
--------------- 
valの一覧
sho322 
男 
hello world! 
-------

軽く読んだ本

jQueryクックブック

作者: jQuery Community Experts,株式会社クイープ
出版社/メーカー: オライリージャパン
発売日: 2010/08/18
メディア: 大型本
購入: 10人クリック: 333回
この商品を含むブログ (40件) を見る

感謝のプログラミング

今回で感謝のプログラミングは【565時間目】
10000時間まで、あと【9435時間】

久しぶりにjQueryを触るとけっこう忘れていた。
でも、一度やったことだから、思い出しやすくなっていた。
こうやって、一度忘れてしまったとしても感覚を取り戻せるように、一つ一つ経験を積み重ねて行きたい。
全てを記憶するのは無理だけど、思い出しやすくすることはできるはず。
明日から仕事！気合入れねば！