我有3个选择选项,可以根据彼此加载值
我的第一个选择是Continent
它在加载时具有大陆的值第二个选择是Country
此选择将在大陆更改时加载,然后最后一个选择是City
这将被加载在改变国家方面它运作良好
目前由于select语句的onchange事件,当我在select from database中加载数据时,它没有显示正确的数据,因为它显示的数据是on change事件时的数据。
我的问题是我如何停止3选择选项的onchange事件,以便我可以从数据库加载数据我认为停止onchange是从数据库加载数据的最佳方式。如果有任何其他选项加载这些选择的数据我会很乐意尝试。
答案 0 :(得分:1)
要阻止事件在jQuery中传播,我们有多个选项,例如event.stopPropagation(),event.preventDefault()。
现在在onchange函数中使用方法来停止传播并使用ajax()方法从数据库加载值。
但是我建议在Continent和country上进行onchange事件,这样每当它们被更改时,只需使用onchange函数中的ajax从数据库填充相应的子值。没有必要停止传播。
答案 1 :(得分:0)
我为你的州制作了一个示例代码。
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>:: Script Test Page ::</title>
<script language='javascript'>
function changeContient()
{
var selectItem = document.getElementById('contient').value;
if ( selectItem=='1' )
{
// select database, using ajax.
// add data into country option. under code is example data.
var country = document.getElementById('country');
country.options[0] = new Option('1-country1','1-country1');
country.options[1] = new Option('1-country2','1-country2');
country.options[2] = new Option('1-country3','1-country3');
}
else if ( selectItem=='2' )
{
// select database, using ajax.
// add data into country option. under code is example data.
var country = document.getElementById('country');
country.options[0] = new Option('2-country1','2-country1');
country.options[1] = new Option('2-country2','2-country2');
country.options[2] = new Option('2-country3','2-country3');
}
else if ( selectItem=='3' )
{
// select database, using ajax.
// add data into country option. under code is example data.
var country = document.getElementById('country');
country.options[0] = new Option('3-country1','3-country1');
country.options[1] = new Option('3-country2','3-country2');
country.options[2] = new Option('3-country3','3-country3');
}
else
{
return;
}
}
function changeCountry()
{
// create soruce like changeContient()
}
</script>
</head>
<html>
<body>
Contient :
<select id='contient' onChange='changeContient();'>
<option value='1'>Contient1</option>
<option value='2'>Contient2</option>
<option value='3'>Contient3</option>
</select>
<br/>
Country :
<select id='country' onChange='changeCountry();'>
</select>
<br/>
</body>
</html>
&#13;