no-image

jQueryでinputのvalueを判別してtarget要素の表示/非表示を行う

[category: jQuery]
<code>
// inputのvalueを判別してtarget要素の表示/非表示を行う
function toggleCollapsedElem(trigger_elem,check_value,target_id) {
// @trigger_elem: 表示のトリガーとなる要素 ex) #form input[name=”hoge”]:checked
// @check_value: trigger_elemが満たすべき値
// @target_id: 表示するcollapse要素のid名 ex) #target_fuga

// 要素を空欄にする関数
function clearForm (elem) {
$(elem)
.find(“input, select, textarea”)
.not(“:button, :submit, :reset, :hidden”)
.val(“”)
.prop(“checked”, false)
.prop(“selected”, false)
;
$(elem).find(“:radio”).filter(“[data-default]”).prop(“checked”, true);
}

// 要素を取得し、check_valueと同じ値だったらshow そうでなければhide
var elem = $(trigger_elem);
if (elem.val() == val) {
$(target).collapse(‘show’);
} else {
$(target).collapse(‘hide’);
clearForm(target); //項目を隠すときに入力内容を消す
}
}

var useage_type = ‘#applicationform input[name=”useage-type”]:checked’;
$(‘#applicationform input[name=”useage-type”]’).on(‘change’, function() {
toggleCollapsedElem(useage_type,’定期利用’,’#repeat_term’);
});
toggleCollapsedElem(useage_type,’定期利用’,’#repeat_term’);
</code>

pocketlinehatebuimagegalleryaudiovideocategorytagchatquotegoogleplusfacebookinstagramtwitterrsssearchenvelopeheartstaruserclosesearch-plushomeclockupdateeditshare-squarechevron-leftchevron-rightleafexclamation-trianglecalendarcommentthumb-tacklinknaviconasideangle-double-upangle-double-downangle-upangle-downstar-halfstatus