条件により押せないボタンを作りたい

質問

2つのセレクトボックスがあり、どちらも選択していれば「検索」ボタンを押せるが
どちらか1つでも選択していなければ「検索」ボタンを押せない状態にしたいのですが
どのようにすれば可能でしょうか？

<script type="text/javascript">
jQuery(function() {
jQuery('#change_btn').click(function() {
jQuery.post('price.php',
{
size : jQuery('#size').attr('value'),
days : jQuery('#days').attr('value')
},
callBack);
});
});
function callBack(data) {
jQuery('#change_area').html(data);
}
</script>

<form action="" id="form1" method="post">
<select name="size" id="size">
<option value="">---選択してください---</option>
<option value="s1">サイズ01</option>
<option value="s2">サイズ02</option>
<option value="s3">サイズ03</option>
</select>
<select name="days" id="days">
<option value="">---選択してください---</option>
<option value="d6">6日</option>
<option value="d8">8日</option>
</select>
<input type="button" id="change_btn" value="検索" />
</form>

回答No.2

babu_baboo · ベストアンサー

<form action="#" id="form1" method="post">
<select name="size" id="size" onchange="hohe()">
<option value="">---選択してください---</option>
<option value="s1">サイズ01</option>
<option value="s2">サイズ02</option>
<option value="s3">サイズ03</option>
</select>

<select name="days" id="days" onchange="hohe()">
<option value="">---選択してください---</option>
<option value="d6">6日</option>
<option value="d8">8日</option>
</select>
<input type="button" id="change_btn" value="検索" disabled>
</form>
--
function hohe () {
var d = document;
var e0 = d.getElementById ('size');
var e1 = d.getElementById ('days');
var e2 = d.getElementById ('change_btn');

e2.disabled = !(e0.value && e1.value);
}

回答No.1

fujillin

対象のボタンをdisabled（あるいは非表示）などにしておいて、セレクトボックスのonchangeイベントでセレクトボックスの値を両方チェックし、OKならボタンのdisabled設定を解除（または表示）のような処理をしてあげればよろしいかと思います。