HTML - JavaScript jQuery - form を後付けで作成

1.　概要

2.　form を後付けで作成

1.　概要

　「PHP」の「Laravel」のようなフレームワークで、動的に作成するテーブルがあるとして


</pre><table class="list">
<tr><th></th>	<th></th>	<th></th>	</tr>

・・・	略	・・・

<tr><td></td>	<td></td>	<td></td>	</tr>
</table><pre>


　行全体で、クリックするとリンクを発生させたい。
　というような場面があります。少なくとも、わたしにはある。

　これいちいち


<tr onclick="location.href='リンク先'">


　と書いたり


<form action="">
</pre><table class="list">
<tr><th></th>	<th></th>	<th></th>	</tr>

・・・	略	・・・

<tr><td></td>	<td></td>	<td></td>	</tr>
</table><pre>
</form>


　と書いておいて


<tr onclick="関数('リンク先')">


　と書く手もありますが、わたしには、長ったらしくて、面倒。

　こういうとき、「form」を後付けで作成する方法があります。

2.　form を後付けで作成

　関数名を仮に「myfunction」としておいて、「.html」としては、前後を「form」ではさんだりせずに


<tr onclick="関数('リンク先')">


　とだけ書いておきます。
　関数で


function myfunction(link)
{
	var form = document.createElement('form');
	form.action = link;
	form.method = 'GET';

	document.body.appendChild(form);
	form.submit();
}


　とだけ書いておけば、いちいち「tr」にネーミング付けしたりせずに、「form」を作成して実行することができます。
　もちろん場合によって、「method」は「POST」にしてもいいわけです。
　わたしは、こうすることで、コーディングが楽になりました。