IE、Edgeが動かない：タグlabel内に書いたinputが動作しない

2018/08/052021/01/09PHPブラウザー,Explore,Edge

IE、EdgeだけLabel内に書いたinputタグの挙動がちがう

inputタグの type="file" を利用してファイルアップロードを作成したのですが
その際に、他の情報も渡そうと思いinputタグ type="hidden"で情報の連携をおこないました。
ただ、今回のinputタグでは、標準のボタンではカッコ悪いのでbootstrapを用いて
ボタンの装飾をおこないました。

IE、Edgeだけinputタグが動かない

firefox、クロームでは動作するのに、IE、Edgeでは動いてくれない。
今回書いた処理は以下のものです。

<form id="file_up_form">
	<label class="btn btn-success btn-lg">
		<input type="hidden" name="main_folder" id="main_folder" value='aaa'> 
		ファイルをアップロードする<input type="file" name="file_dat" style="display:none" onChange='fileUpLoad();return false;'>
	</label>
</form>

試行錯誤の結果inputタグ type="hidden"の記述場所が悪かったようです。

修正版

<form id="file_up_form">
	<input type="hidden" name="main_folder" id="main_folder" value='aaa'> 
	<label class="btn btn-success btn-lg">
		ファイルをアップロードする<input type="file" name="file_dat" style="display:none" onChange='fileUpLoad();return false;'>
	</label>
</form>

なにも、Labelの中に書く必要はないので、外に出してあげれば、正常に動きました。
これが正しい記述方法なのでしょうか。
firefox、クロームは補正して動いてくれていたのでしょうか。

システムトラストでは、システムエンジニア、プログラマーなどを随時募集中です。気軽にご相談ください。

お問合せ