问题描述
- 如何去实现二级联动 第三级变成文本框并且能输入值
-
如图片一样 怎么实现币种存期二级联动 而当存期变动后 年利率可以的文本框可以出现值呢 用jQuery 感谢大神们 说的详细一点呗
解决方案
不知道你具体存期 数据哪里来的。
<!DOCTYPE html>
<html>
<head>
<script src="http://www.w3school.com.cn/jquery/jquery-1.11.1.min.js">
</script>
<script>
$(document).ready(function(){
var o=[{'id':'1','val':'1'},{'id':'2','val':'2'},{'id':'3','val':'3'}];
var o1=[{'id':'1','val':'子1'},{'id':'2','val':'子2'},{'id':'3','val':'子3'}];
var tmp='';
for(var i=0;i<o.length;i++){
tmp+= "<option value='"+o[i].id +"'>"+o[i].val+"</option>"
}
$("#sel1").append(tmp);
$("#sel1").change(function(){
$('#test').val('');
$("#sel2").empty();
$("#sel2").append('<option>----请选择----</option>');
for(var i=0;i<o1.length;i++){
if($("#sel1").val()==o1[i].id){
$("#sel2").append("<option value='"+o1[i].id +"'>"+o1[i].val+"</option>");
}
}
})
$("#sel2").change(function(){$('#test').val( $("#sel2").find("option:selected").text()); });
});
</script>
</head>
<body>
币种<select id="sel1">
<option>----请选择----</option>
</select>
年利率<select id="sel2">
<option>----请选择----</option>
</select>
存期<input type='text' id="test"/>
</body>
</html>
解决方案二：
是这样么？
只贴出核心代码：
<div class="form-group" id="alg1" style="display:none">
<div class="form-group" id="alg2" style="display:none">
<script type="text/javascript">
$(".select_gallery").select2();
$("#alg").change(function(){
var algValue = $(this).val();
for(var i=1; i<3;i++){
var algid = "alg"+i;
if (algValue == algid) {
$("#hr_line").css("display","block");
$("#"+algid).slideDown(200).css("display","block");
} else {
$("#"+algid).css("display","none");
}
}
if (algValue == 0){
$("#hr_line").css("display","none");
}
});
</script>
对于出现值也是一样的原理，选中以后$().text(值);灵活处理
解决方案三：
简单的二级联动效果，随便找个代码详解的，看懂了，你就会写了！
解决方案四：
参考这个改改
解决方案五：
你说的还是二级联动，，给存期一个change事件，，存期改变时就让年利率变为文本框输入就行了
解决方案六：
http://ask.csdn.net/questions/230597
之前不是给过你了。。只是将动态页改为你的jsp页面而已。。
解决方案七：
根据change事件获取第一个select的值，作为参数，请求第二个select的option，然后第二个如是
解决方案八：
<!DOCTYPE html>
<html>
<head>
<script src="http://www.w3school.com.cn/jquery/jquery-1.11.1.min.js">
</script>
<script>
$(document).ready(function(){
var o=[{'id':'1','val':'人民币'},{'id':'2','val':'日元'},{'id':'3','val':'美元'}];
var o1=[{'id':'1','val':'一天通知'},{'id':'2','val':'七天通知'},{'id':'3','val':'一个月'},{'id':'4','val':'三个月'}];
var tmp='';
for(var i=0;i<o.length;i++){
tmp+= "<option value='"+o[i].id +"'>"+o[i].val+"</option>"
}
$("#sel1").append(tmp);
tmp='';
for(var i=0;i<o1.length;i++){
tmp+= "<option value='"+o1[i].id +"'>"+o1[i].val+"</option>"
}
$("#sel2").append(tmp);
$("#sel1").change(function(){
$('#test').val('');
$("#sel2").empty();
tmp='<option>----请选择----</option> ';
for(var i=0;i<o1.length;i++){
tmp+= "<option value='"+o1[i].id +"'>"+o1[i].val+"</option>"
}
$("#sel2").append(tmp);
});
$("#sel2").change(function(){
if($("#sel2").val()=='1'){
$('#test').val('0.3');
}else if($("#sel2").val()=='2'){
$('#test').val('0.3');
}else if($("#sel2").val()=='3'){
$('#test').val('0.5');
}else if($("#sel2").val()=='4'){
$('#test').val('0.7');
}else{
$('#test').val('');
}
});
});
</script>
</head>
<body>
币种<select id="sel1">
<option>----请选择----</option>
</select>
年利率<select id="sel2">
<option>----请选择----</option>
</select>
存期<input type='text' id="test"/>
</body>
</html>
解决方案九：
<!DOCTYPE html>
<html>
<head>
<script src="http://www.w3school.com.cn/jquery/jquery-1.11.1.min.js">
</script>
<script>
$(document).ready(function(){
var o=[{'id':'1','val':'人民币'},{'id':'2','val':'日元'}];
var o1=[ {'id':'1',val: [ {'id':'1','val':'一天通知'},{'id':'2','val':'七天通知'},{'id':'3','val':'一个月'},{'id':'4','val':'三个月'}]},{'id':'2',val:[ {'id':'3','val':'一个月'},{'id':'4','val':'三个月'}]}];
var tmp='';
for(var i=0;i<o.length;i++){
tmp+= "<option value='"+o[i].id +"'>"+o[i].val+"</option>"
}
$("#sel1").append(tmp);
tmp='';
for(var i=0;i<o1.length;i++){
tmp+= "<option value='"+o1[i].id +"'>"+o1[i].val+"</option>"
}
$("#sel2").append(tmp);
$("#sel1").change(function(){
$('#test').val('');
$("#sel2").empty();
tmp='<option>----请选择----</option> ';
for(var i=0;i<o1.length;i++){
if(o1[i].id==$("#sel1").val()){
for(var j=0;j<o1[i].val.length;j++){
tmp+= "<option value='"+o1[i].val[j].id +"'>"+o1[i].val[j].val+"</option>"
}
}
}
$("#sel2").append(tmp);
});
$("#sel2").change(function(){
if($("#sel2").val()=='1'){
$('#test').val('0.3');
}else if($("#sel2").val()=='2'){
$('#test').val('0.3');
}else if($("#sel2").val()=='3'){
$('#test').val('0.5');
}else if($("#sel2").val()=='4'){
$('#test').val('0.7');
}else{
$('#test').val('');
}
});
});
</script>
</head>
<body>
币种<select id="sel1">
<option>----请选择----</option>
</select>
年利率<select id="sel2">
<option>----请选择----</option>
</select>
存期<input type='text' id="test"/>
</body>
</html>****
时间： 2024-09-16 20:34:51