### radioボタンの選択状況の取得
<form method="" action=""> <label for="en"><input type="radio" id="en" name="lang" value="1" checked>英語</label> <label for="cn"><input type="radio" id="cn" name="lang" value="2">中国語(簡体字)</label> </form> <script> window.addEventListener('DOMContentLoaded', function(){ var inputs = document.querySelectorAll("input[name=lang]"); for(var element of inputs){ element.addEventListener('change', function(){ if(this.checked){ console.log(this.value); } }); } }) </script>
値を取得できているのがわかります。
表示自体を変えるには display noneとdisplay blockを切り分けます。
<label> <input class="js-check" type="radio" name="lang" value="1" onclick="formSwitch()" checked>英語 </label> <label> <input class="js-check" type="radio" name="lang" value="2" onclick="formSwitch()">中国語(簡体字) </label> <br><br> <span id="en">Name</span> <span id="cn">产品名称</span> <script> var en = document.getElementById('en'); var cn = document.getElementById('cn'); cn.style.display = "none"; function formSwitch() { check = document.getElementsByClassName('js-check') if (check[0].checked) { cn.style.display = "none"; en.style.display = "block"; } else if (check[1].checked) { en.style.display = "none"; cn.style.display = "block"; } } window.addEventListener('load', formSwitch()); </script>
うん、これでOKかな。