複数あるﾌｫｰﾑで指定のﾌｫｰﾑをﾛｰｶﾙｽﾄﾚｰｼﾞに入れるにはどうすればいいでしょうか？以下のｿｰｽの場合name="form3"にある登録ﾘﾝｸをｸﾘｯｸするとform1の…

複数あるﾌｫｰﾑで指定のﾌｫｰﾑをﾛｰｶﾙｽﾄﾚｰｼﾞに入れるにはどうすればいいでしょうか？
以下のｿｰｽの場合name="form3"にある登録ﾘﾝｸをｸﾘｯｸするとform1の"ﾃｽﾄ1"の値がﾛｰｶﾙｽﾄﾚｰｼﾞに入ってしまいます｡
form1の登録ﾘﾝｸを押すと"ﾃｽﾄ1"､form3だとﾃｽﾄ3が入るようにしたいです｡

<form name="form1">
<input id="postid" type="hidden" value="ﾃｽﾄ1">
<a href="#" onClick="setlocalStorage(); return false;">登録<a>
</form>
<form name="form2">
<input id="postid" type="hidden" value="ﾃｽﾄ2">
<a href="#" onClick="setlocalStorage(); return false;">登録<a>
</form>
<form name="form3">
<input id="postid" type="hidden" value="ﾃｽﾄ3">
<a href="#" onClick="setlocalStorage(); return false;">登録<a>
</form>

<script type="text/javascript">
//init
$(document).ready(viewStorage);
// localStorageへの格納
function setlocalStorage() {
var obj = {
postid:$("#postid").val(),
title:$("#title").val(),
};
//ﾃﾞｰﾀの保存
localStorage.setItem($("#postid").val(),JSON.stringify(obj));
}
</script>

｢同じ形のﾌｫｰﾑが複数あって､ｸﾘｯｸした要素が含まれているﾌｫｰﾑの値を取り出したい｣のだと､脳内で変換しました｡

<form name="form1">
 <input type="hidden" value="ﾃｽﾄ1"> <!-- id 削りました -->
 <a href="#" class="register">登録</a> <!-- onclick ではなく､class を指定 -->
</form>
<form name="form2"> <!-- form の名前と､input の value だけが違います -->
 <input type="hidden" value="ﾃｽﾄ2">
 <a href="#" class="register">登録</a>
</form>
<form name="form3">
 <input type="hidden" value="ﾃｽﾄ3">
 <a href="#" class="register">登録</a>
</form>


<script type="text/javascript">

/*
 class="register" な要素に処理を登録
 */
$(".register").click(function(event) {

 // ｸﾘｯｸされた要素のひとつ前を取り出す
 var e = $(this).prev();

 // ひとつ前の要素の value 属性を確認
 alert(e.val());


 /*
 ﾛｰｶﾙｽﾄﾚｰｼﾞに入れるなり､何なり...
 */


 // Aﾀｸﾞのﾃﾞﾌｫﾙﾄの動作を無効にする
 event.preventDefault();

});

</script>

この範囲であれば､ﾌｫｰﾑの name もﾕﾆｰｸにする必要はないです｡

質問の補足を受けての､追記です｡

form内にidが複数ある場合はどうすればいいでしょうか？

ｸﾘｯｸした要素の親から､その子供を取得します｡
こんな感じ｡

<form name="form1">
<input id="postid1" type="hidden" value="ﾃｽﾄ11">
<input id="postid2" type="hidden" value="ﾃｽﾄ12">
<input id="postid3" type="hidden" value="ﾃｽﾄ13">
<a href="#" class="register">登録</a> <!-- 最後が <a> になってたのが地味に罠です :-) -->
</form>
<form name="form2">
<input id="postid1" type="hidden" value="ﾃｽﾄ21">
<input id="postid2" type="hidden" value="ﾃｽﾄ22">
<input id="postid3" type="hidden" value="ﾃｽﾄ23">
<a href="#" class="register">登録</a>
</form>

<form name="form3">
<input id="postid1" type="hidden" value="ﾃｽﾄ31">
<input id="postid2" type="hidden" value="ﾃｽﾄ32">
<input id="postid3" type="hidden" value="ﾃｽﾄ32">
<a href="#" class="register">登録</a>
</form>

<script type="text/javascript">

$(function() {

 /*
 class="register" な要素に処理を登録
 */
 $(".register").click(function(event) {

 // ｸﾘｯｸされた親の要素(ﾌｫｰﾑ)
 var f = $(this).parent();

 // ﾌｫｰﾑの子供で､type="hidden" な INPUT を取り出す
 var obj = {}
 $("input[type='hidden']", f).each(function() {
 obj[ this.id ] = $(this).val();
 });

 // JSON 形式の文字列にする
 var data = JSON.stringify(obj);

 // ﾃﾞｰﾀを確認
 console.log(data);

 // ﾃﾞｰﾀを保存
 localStorage.setItem("form_data", data);

 // Aﾀｸﾞのﾃﾞﾌｫﾙﾄの動作を無効にする
 event.preventDefault();
 });

});
</script>

最初に質問に書かれたｺｰﾄﾞを尊重して､ﾃﾞｰﾀを JSON 形式の文字列でｽﾄﾚｰｼﾞに保存していますが､それぞれの ID をｷｰにして保存したいのであれば､子要素をたどるところをこんな感じに｡

 // ﾌｫｰﾑの子供で､type="hidden" な INPUT を保存する
 $("input[type='hidden']", f).each(function() {
 localStorage.setItem(this.id, $(this).val());
 });

form内にidが複数ある場合はどうすればいいでしょうか？

<form name="form1">
<input id="postid1" type="hidden" value="ﾃｽﾄ11">
<input id="postid2" type="hidden" value="ﾃｽﾄ12">
<input id="postid3" type="hidden" value="ﾃｽﾄ13">
<a href="#" onClick="setlocalStorage(); return false;">登録<a>
</form>
<form name="form2">
<input id="postid1" type="hidden" value="ﾃｽﾄ21">
<input id="postid2" type="hidden" value="ﾃｽﾄ22">
<input id="postid3" type="hidden" value="ﾃｽﾄ23">
<a href="#" onClick="setlocalStorage(); return false;">登録<a>
</form>

<form name="form3">
<input id="postid1" type="hidden" value="ﾃｽﾄ31">
<input id="postid2" type="hidden" value="ﾃｽﾄ32">
<input id="postid3" type="hidden" value="ﾃｽﾄ32">
<a href="#" onClick="setlocalStorage(); return false;">登録<a>
</form>