Hay dos formas de hacerlo, la correcta (con ajax) y la rustica. Ambas 2 involucran javascript y los cambios entre ambos metodos son muy pocos, te muestro un ejemplo de la forma sin ajax, pero deberias considerar usarlo ya que no es dificil de implementar.
Código PHP:
Ver original<?php
require_once('Connections/HD.php');
$categorias = mysql_query("select id_categoria, descripcion from categorias"); $sub_categorias = mysql_query ("select id_categoria, id_sub_categoria, descripcion from subcategorias"); ?>
<form id="form1" name="form1" method="post">
<select name="categoria" id="categoria">
<option selected="selected">Seleccione una categoria</option>
<?php
echo "<option value=\"$categoria[id_categoria]\">$categoria[descripcion]</option>";
?>
</select>
<select name="subcategoria" id="subcategoria">
<option selected="selected" data-categoria="0">Seleccione una sub-categoria</option>
<?php
echo "<option value=\"$sub_categoria[id_sub_categoria]\" data-categoria=\"$sub_categoria[id_categoria]\">$sub_categoria[descripcion]</option>";
?>
</select>
</form>
<script>
function updateSubCategorias()
{
var s_categorias = document.querySelectorAll("#subcategoria option");
var categoria_actual = document.getElementById("categoria").value;
for(var nro=0; nro < s_categorias.length; nro++)
{
var categoria = s_categorias[nro].getAttribute("data-categoria");
if(categoria == 0 || categoria == categoria_actual)
s_categorias[nro].style.display = 'block';
else
s_categorias[nro].style.display = 'none';
}
}
document.getElementById("categoria").addEventListener("change", updateSubCategorias);
updateSubCategorias();
</script>
Si quieres implementar ajax, solo tienes que poner la peticion dentro de la funcion updateSubCategorias() y realizar minimos cambios.