クリックすると展開するフォームがあり、クリックすると追加/高度なオプションが利用可能になり、展開すると通常の/基本的なフォームに戻るオプションも表示されます。この場合、フォームの高度な部分に入力されたものをすべて削除したいと考えています。
私はこれまでに来ました:
$(function() {
$('#more').hide();
$("#advanced_search").click(function(){
$(this).text($(this).text() == 'Show advanced search options' ? 'Hide advanced search options (selected options will be deleted)' : 'Show advanced search options');
$('#more input').val('');
$('#swimming-pool').prop('checked', false);
var select = ("#location");
select.find("option[value='']").attr('selected','selected');
select.data("selectBox-selectBoxIt").refresh();
$('#more').slideToggle();
return false;
});
});
私が直面している問題は、選択の見栄えを良くする追加のプラグインselectBoxItを使用していることです。問題は、選択ボックスをリセットしてやりたい場合です
$('#location').val('');
次に、これにより値が設定されますが、実際には、選択ボックスで選択されている可視オプションは変更されません。どうやらあなたがしなければならないことはこれです:
select.data("selectBox-selectBoxIt").refresh();
しかし、それを使用するとすぐに、slideToggle(); 狂って動作を停止します (一瞬スライドして元に戻ります)。
フォームの高度な部分は、3 つの選択で構成されています。#location #ownership #furniture
いくつかのテキスト入力とチェックボックスがあり、問題なく削除されます。選択に問題があります。
slideToggle の問題を示すフィドル: jsfiddle.net/L3Aux/6