2选中第一个下拉框的任意一个值,同时第三个下拉框的值跟着改变,显示对应的数据。
ps:what光动态添加就足以。。。。赋值还不能直接赋,而是添加下拉时就赋值。。。。。经过百般折磨,头发掉了n根,最终通过巧妙的思路解决了,在此记录下。若对你有所帮助,点赞加关注吧!后续及时更新。
第一个下拉选项显示
选择下拉项,同时加载数据到第三个下拉框
注:在这里直接去掉了第二行的标签
为了获取改变数据的行,试了很久,动态生成的下拉框无法获取到索引,所以才想到了使用id,并且给id后加一个数字
$post("/Com/GetCom", { "uu": $('#comuu')val() }, function (data) {//data就是json数据
if (data != "") {
var dataObj = eval("(" + data + ")"); //转换为json对象
for (var i = 0; i < dataObjrowslength; i++) {
$("#day")append("<option value='" + dataObjrows[i]UU + "'>" + dataObjrows[i]ChildComName + "</option>");
}
}
else {
//如果json为空
}
});
1、简单做法:使用onchange触发页面重新加载,如取得下拉框的值后,重定向网址windowlocationhref = "searchtype="+下拉框的值
2、用ajax动态刷新用户列表区域,这种方法写起来稍有点麻烦
JS访问数据库应该是可以的,前提是你必须把网页保存成hta格式。html格式的文件没有足够的权限。
楼主如果想在网页中访问数据库,就不要使用JS吧,PHP/ASP/JSP都行。
如果楼主想做一个本地使用的程序访问数据库,那只要把页面存成hta就行了。
本人用的PHP,其实思路应该是差不多的。
我用的是AJAX,对每次下拉框的onchange事件,作一次异步请求,请求的当然就是服务器的处理程序了(一般是查询数据库),获取返回的json结果,然后再通过JS显示在后面的文本框
下面是分类联动选择的部分JS代码:
//子级category选择
getChildCategory:function(p,c,g){
//$("#pArea")live('change',function(){
var parent_id = $("#" + p)val();
if(parent_id == 0){
return false;
//$("#" + c)hide();
//$("#" + g)hide();
}
$ajax({
type:"POST",
url:"include/getNextCategoryphptype=child",
dataType:"json",
data:{"parent_id":parent_id},
success:function(json){
if(jsonsuccess == 1){
//alert("这里能执行???");
//$("#" + c)show();
$("#" + c)html("");
$("#" + c)append(jsonnext_category);
//$("#" + c)get(0)selectedIndex = 0;
$("#" + g)html("");
} else {
//alert("failed");
//$("#" + c)html("<option>其他</option>");
}
}
});
//alert(p_category + " > " + c_category + " > " + g_category);
$("#category")val(p_category + " > " + c_category + " > " + g_category);
},
后台程序也很简单:
if($type == 'child'){
$query = "SELECT cid, name FROM aidu_category WHERE pid = '$pid'";
}
if($type == 'grand'){
$query = "SELECT cid, name FROM aidu_category WHERE pid = '$cid'";
}
$db->query($query);
$arr['next_category'] = "";
if($pid == '0' || $cid == '0'){
$arr['success'] = 0;
}
if($db->db_num_rows() > 0){
$arr['success'] = 1;
while($row = $db->fetch_assoc()){
$arr['next_category'] = "<option value=" $row['cid'] ">" $row['name'] "</option>";
}
} else {
$arr['success'] = 0;
//echo "没有查询到子级区域";
}
echo json_encode($arr);
- -本人技术比较菜,请见谅
/
@author zhou2003737
@date 2014/09/25 16:39
/
<html doctype="html">
<head>
<title></title>
<script type="text/javascript">
windowonload = function(){
//获取文本框对象
var searchText = documentgetElementById("searchText");
//获取提交button对象
var action = documentgetElementById("action");
//获取要增加到的下拉列表对象
var selections = documentgetElementById("selections");
//点击提交的时候执行的方法
actiononclick = function(){
//如果文本框对象中值不为空
if(searchTextvalue ){
//根据文本框中的值循环5次
for(var i =5;i>0;i--){
//设置下拉列表中的值的属性
var option = documentcreateElement("option");
optionvalue = searchTextvalue + i;
optiontext= searchTextvalue+i;
//将option增加到下拉列表中。
selectionsoptionsadd(option);
}
}
}
}
//思路如上。你可以将点击时将文本框中值传到后台,后台返回数据后,在将数据存入下拉列表对象中。
</script>
</head>
<body>
<p><input type="text" placeholder="请输入查询对象" autofocus id="searchText"/></p>
<p><input type="button" id="action" value="提交"/></p>
<p><select id="selections">
</select></p>
</body>
</html>
比如有一个下拉框定义如下:
<asp:dropdownlist id="ddlBusCode" runat="server"></asp:dropdownlist>
那么可以利用以下方法来获取值:
方法一:
var ddl = documentgetElementById("ddlBusCode")
var index = ddlseletedIndex;
var Value = ddloptions[index]value;
var Text = ddloptions[index]text;
方法二:
var aaa=ddlBusCodeoptions[thisselectedIndex]value;
function findObject(fName,initValue){
var xml>
以上就是关于JS与Jquery之动态添加下拉框select并级联改变事件全部的内容,包括:JS与Jquery之动态添加下拉框select并级联改变事件、js下拉框怎么加载json数据、根据下拉框选择内容读取数据库内容并显示等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)