<form action="search.php" method="get" name="form1" id="form1">
<select style="border:1px solid rgb(102,153,204);background-color:FFFFCC;height:20px;width:120px;" onfocus="this.style.background='white'" onblur="this.style.background='FFFFCC'" name="name" id="myselect">
<option value="category">CATEGORY</option>
<option value="product">PRODUCT</option>
</select>
<input name="value" type="text" id="catprod" style="border:1px solid rgb(102,153,204);background-color:FFFFCC;height:15px;width:200px;" onfocus="this.style.background='white'" onblur="this.style.background='FFFFCC'" size="20" />
<script>
var submitform = function() {
form1.submit();
}
document.getElementById('myselect').onchange = submitform;
</script>
インライン CSS を使用しないことを強くお勧めします。これは、ID (およびクラス) により意味のある名前を付けているためです。また、インライン JS の使用は避けてください。
スクリプト タグのコードが行うことは、select 要素の値を変更したときにフォームを送信することです。フォームはメソッド「get」を使用しているため、フォームを送信すると、これらのタイプの URL が表示されます。