3 选项从数据库中删除更改时选择设置值
3 option select set value from database remove onchange
>我有 3 个选择选项,可以相互加载值
我的第一个选择是Continent
它具有加载时大陆的值第二个选择是Country
此选择将在更改大陆时加载,然后最后一个选择City
这将在更改国家/地区时加载,它工作正常
目前,由于当我在数据库中加载数据时 select 语句的 onchange 事件,它没有显示正确的数据,因为它显示的是 on change 事件时的数据。
我的问题是如何停止 3 选择选项的 onchange 事件,以便我可以从数据库中加载数据,我认为停止 onchange 是从数据库加载数据的最佳方式。如果有任何其他选项可以在这些选择上加载数据,我很乐意尝试。
要阻止事件在 jQuery 中传播,我们有多个选项,例如 event.stopPropagation((、event.preventDefault((。
现在,在 OnChange 函数中,使用这些方法停止传播并使用 ajax(( 方法从数据库中加载值。
但是我建议在大陆和国家/地区设置onchange事件,以便无论何时更改它们,只需在onchange函数中使用ajax从数据库中填充相应的子值即可。 无需停止传播。
我为您的状态制作了一个示例代码。
<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>
相关文章:
- 如何根据另一选择中的选择设置一个选择中的文本
- jQuery为按钮选择设置活动类
- 根据两个下拉菜单的选择设置隐藏值
- Bootstrap/AngularJs:如何为导航类的活动选择设置粗体属性
- Ember选择设置内容绑定
- KnockoutJS可观测值为't通过选择设置
- 3 选项从数据库中删除更改时选择设置值
- 如何根据下拉框选择设置文本框值
- 挖空 + 选择2 -- 设置默认值
- jQuery 验证 - 根据用户选择设置条件规则
- 使用角度引导选择设置下拉列表的选定选项
- 运行流星如何选择设置文件
- Dojo选择设置值不能与动态生成的选项一起工作
- 如何根据引导项选择设置变量
- 多重选择设置导致angular出错
- 具体化选择设置动态选项问题
- 表单:选择设置img src
- 基于列表框选择设置列表项
- 根据先前选择标记中的选择设置选择标记的可见性
- 如何根据下拉选择设置单选按钮值