我正在制作一个简单的注册系统,用户必须先选择州,然后再选择城市。到现在为止还挺好。我还创建了一个函数来指定两个拥有不同航运城市的州。
用户选择他居住的州,然后输入城镇。如果他选择特定的州,他会从 SELECT FIELD 中选择城市。到目前为止也很好。
每次更改选择#estado 时,我都想清除输入#cidade。
到目前为止我的javascript:
$(function() {
$('#estado').change(function() {
var typeSelected = $(this).val();
if (typeSelected == "0") {
$('#cidade').hide();
$('#santacatarina').hide();
$('#parana').hide();
}
else if (typeSelected == "Santa Catarina") {
$('#cidade').hide();
$('#santacatarina').show();
$('#parana').hide();
}
else if (typeSelected == "Paraná") {
$('#cidade').hide();
$('#santacatarina').hide();
$('#parana').show();
}
else{
$('#cidade').show();
$('#santacatarina').hide();
$('#parana').hide();
}
}).change();
});
$(function() {
$('#cidadesSC').change(function() {
var typeSelected = $(this).val();
if (typeSelected == "0") {
$('#outraCidadeSC').hide();
}
else if (typeSelected == "Outra Cidade") {
$('#outraCidadeSC').show();
}
else{
$('#outraCidadeSC').hide();
}
}).change();
});
$(function() {
$('#cidadesPR').change(function() {
var typeSelected = $(this).val();
if (typeSelected == "0") {
$('#outraCidadePR').hide();
}
else if (typeSelected == "Outra Cidade") {
$('#outraCidadePR').show();
}
else{
$('#outraCidadePR').hide();
}
}).change();
});
//here is the function I've been trying to do the clear of #cidade
$(function() {
$('#estado').change(function() {
$('#cidade').clear();
});
});
它的 HTML。它有点长:
<select id="estado" name="estado">
<option value="0">Selecione</option>
<option value="Acre">Acre</option>
<option value="Alagoas">Alagoas</option>
<option value="Amazonas">Amazonas</option>
<option value="Amapá">Amapá</option>
<option value="Bahia">Bahia</option>
<option value="Ceará">Ceará</option>
<option value="Distrito Federal">Distrito Federal</option>
<option value="Espírito Santo">Espírito Santo</option>
<option value="Goiás">Goiás</option>
<option value="Maranhão">Maranhão</option>
<option value="Minas Gerais">Minas Gerais</option>
<option value="Mato Grosso">Mato Grosso</option>
<option value="Mato Grosso do Sul">Mato Grosso do Sul</option>
<option value="Pará">Pará</option>
<option value="Paraíba">Paraíba</option>
<option value="Paraná">Paraná</option>
<option value="Pernambuco">Pernambuco</option>
<option value="Piauí">Piauí</option>
<option value="Rio de Janeiro">Rio de Janeiro</option>
<option value="Rio Grande do Norte">Rio Grande do Norte</option>
<option value="Rio Grande do Sul">Rio Grande do Sul</option>
<option value="Rondonia">Rondonia</option>
<option value="Roraima">Roraima</option>
<option value="Santa Catarina">Santa Catarina</option>
<option value="Sergipe">Sergipe</option>
<option value="São Paulo">São Paulo</option>
<option value="Tocantins">Tocantins</option>
</select>
<input id="cidade" type="text" style="display:none; border:2px solid blue;">
<div style="clear:both;"></div>
<div id="santacatarina" style="display:none;">
<select id="cidadesSC" name="cidadesSC">
<option value="0">Selecione</option>
<option value="Araquari">Araquaria</option>
<option value="Balneário Camboriú">Balneário Camboriú</option>
<option value="Barra Velha">Barra Velha</option>
<option value="Biguaçu">Biguaçu</option>
<option value="Blumenau">Blumenau</option>
<option value="Bombinhas">Bombinhas</option>
<option value="Brusque">Brusque</option>
<option value="Camboriú">Camboriú</option>
<option value="Florianópolis">Florianópolis</option>
<option value="Garuva">Garuva</option>
<option value="Gaspar">Gaspar</option>
<option value="Governador Celso Ramos">Governador Celso Ramos</option>
<option value="Ilhota">Ilhota</option>
<option value="Indaial">Indaial</option>
<option value="Itajaí">Itajaí</option>
<option value="Itapema">Itapema</option>
<option value="Itapoá">Itapoá</option>
<option value="Jaraguá do Sul">Jaraguá do Sul</option>
<option value="Joinville">Joinville</option>
<option value="Luiz Alves">Luiz Alves</option>
<option value="Navegantes">Navegantes</option>
<option value="Palhoça">Palhoça</option>
<option value="Penha">Penha</option>
<option value="Piçarras">Piçarras</option>
<option value="Pomerode">Pomerode</option>
<option value="Porto Belo">Porto Belo</option>
<option value="São Francisco do Sul">São Francisco do Sul</option>
<option value="São José">São José</option>
<option value="Schroeder">Schroeder</option>
<option value="Tijucas">Tijucas</option>
<option value="Timbó">Timbó</option>
<option value="Outra Cidade">Outra Cidade</option>
</select>
<p style="float:right;">Santa Catarina possuí cidades com <a href="#">Frete Grátis</a></p>
<input id="outraCidadeSC" type="text" style="display:none; border:2px solid red;">
</div>
<div id="parana" style="display:none;">
<select id="cidadesPR" name="cidadesPR">
<option value="0">Selecione</option>
<option value="Curitiba">Curitiba</option>
<option value="Outra Cidade">Outra Cidade</option>
</select>
<p style="float:right;">Paraná possuí cidades com <a href="#">Frete Grátis</a></p>
<input id="outraCidadePR" type="text" style="display:none; border:2px solid green;">
</div>
我能做些什么?