[js]javascriptでhtmlを汚さずにinputをどうこうする

対MW WP FORM。
何も考えずローカルで組んだやつをぶっこんだらえらい目にあった。

環境

  • MW WP Form2.5.2

type=”hidden”にidとかclassをつける

<div class="hidden_box"><input type="hidden" /></div>
//id 付与
$(function(){
$('#hidden_box input[type="hidden"]').attr('id', 'type_select');
});

現状MW WP Formではtype=”hidden”に直接idが振れないのでjsでどうにかしないといけない。
classとかidとか振ったdivとかで囲って、そっから引っ張って指定する。

selectとかradioで指定したやつのvalueをよそのinputのvalueにつっこむ

<label><input type="radio" name="01" value="うんこ" />うんこ</label>
<label><input type="radio" name="01" value="ちんこ" />ちんこ</label>
<label><input type="radio" name="01" value="まんこ" />まんこ</label>
<label><input type="radio" name="01" value="アナル" />アナル</label>

<input type="text" name="hoge" id="textbox" />
//valueをvalueにぶっこむ
$(document).ready(function(){
var radio = $("input:radio[name='01']");
var valtext = radio.val();
$("#textbox").val(valtext);
$("input:radio").click(function(){
var radio = $("input:radio[name='01']");
var valtext = $(this).val();
if (radio[0].checked){
$("#textbox").val(valtext);
} else if (radio[1].checked){
$("#textbox").val(valtext);
} else if (radio[2].checked){
$("#textbox").val(valtext);
} else if (radio[3].checked){
$("#textbox").val(valtext);
}
});
});

inputをidで引っ張ったり
inputをnameで引っ張ったり
inputをtypeで引っ張ったり
処理同じなのにいちいち書いてたりと
ぶっちゃけ色々冒険しまくってたり無駄があったりであんまりいい例になってない。

6行目から、radioを選択した時をトリガーにif文で分けて、
選択したのがn番目のradioだったら該当のradioのvalueを8行目で宣言した7行目のやつでもって入れ込むってことになってる。

同じやつをif文の手前で書いてるのは、if文だけだと読み込み時に拾ってくれないから。

上のhiddenと絡めて使う必要があったのでいんたーねっつの力を借りて頑張ったよ
onclickをinputに仕込めないからなぁ

コメント

タイトルとURLをコピーしました