Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/jquery/76.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Jquery 如何使用引导将单选按钮与选择框组合_Jquery_Css_Twitter Bootstrap 3_Bootstrap 4 - Fatal编程技术网

Jquery 如何使用引导将单选按钮与选择框组合

Jquery 如何使用引导将单选按钮与选择框组合,jquery,css,twitter-bootstrap-3,bootstrap-4,Jquery,Css,Twitter Bootstrap 3,Bootstrap 4,我需要将单选按钮和选择框组合在一起。是否有内置的框架可以做到这一点?。我尝试了一个代码,但这不是一个合适的编码方式。下面我给出了代码部分的输出 这里,Class和lab是单选按钮,它附带了一个选择框。但是我的代码有错误。下面是我给出的代码: <div class="btn-group" data-toggle="buttons"> <label class="btn btn-cyan btn-rounded form-check-label"> <label cl

我需要将单选按钮和选择框组合在一起。是否有内置的框架可以做到这一点?。我尝试了一个代码,但这不是一个合适的编码方式。下面我给出了代码部分的输出

这里,Class和lab是单选按钮,它附带了一个选择框。但是我的代码有错误。下面是我给出的代码:

<div class="btn-group" data-toggle="buttons">
<label class="btn btn-cyan btn-rounded form-check-label">
<label class="btn btn-cyan btn-rounded form-check-label" style="padding: 5px 5px 5px 5px;">
    <input class="form-check-input" type="radio" autocomplete="off"> Class
</label>

<label class="btn btn-cyan btn-rounded form-check-label" style="padding: 5px 5px 5px 5px;">
    <input class="form-check-input" type="radio" autocomplete="off"> Lab
</label>
    <select class="form-check-input" autocomplete="off"> <option>HELLO</option><option>HELLO</option><option>HELLO</option></select>
</label>
 </div>

等级
实验室
你好

在这里,select变成了一个按钮,因为我使用了btn类。请帮助我修复代码。他们的任何替代内容是否已经存在(组合单选按钮和选择框)

请尝试以下代码片段。一旦你点击了一个值,它将需要引用javascript中的列表并将其发布到选择选项中。这些值根据每个单选按钮的不同而变化

您可以通过大写字母和简单的单词以及单选按钮单击时的变化来识别

干杯

var listA=[{
姓名:'你好',
值:“你好”
}, {
姓名:‘你好’,
价值观:“嗨”
}, {
名称:'测试',
值:“测试”
}];
var listB=[{
姓名:'你好',
值:“你好”
}, {
姓名:‘你好’,
价值观:“嗨”
}, {
名称:'测试',
值:“测试”
}];
$(文档).ready(函数(){
$(“input[name='chk']”)。在('change',function()上{
if($(this).is(':checked')&&&$(this.val()=='hello'){
$('#descripe').empty()
$.each(列表、函数(索引、值){
$('#descripe').append(''+value.name+'');
});
}else if($(this).is(':checked')&&&$(this.val()=='HELLO'){
$('#descripe').empty()
$.each(列表B,函数(索引,值){
$('#descripe').append(''+value.name+'');
});
}否则{
}
});
});
.radioBtn{
位置:绝对位置;
保证金:0;
不透明度:0;
}
.radioBtn:以前{
内容:'';
位置:绝对位置;
顶部:-10px;
底部:-10px;
左:-10px;
右:-10px;
光标:指针;
}
#描述{
左边距:10px
}
.lbl{
显示:块;
填充物:5px;
背景色:#ccc;
}

等级
实验室
A.
B

我不太清楚您想要实现的目标。请发送您想要实现的示例图片。您是否希望下拉列表中的值根据所选单选按钮发生变化(例如,
Hello
仅是
Class
Lab
)的选项?@Stevangelista我的概念非常简单。我有两个单选按钮,分别名为class和lab。如果我单击class,则选择框必须显示各自的类名,反之亦然。这很简单。但这里我的问题是,我想使电台btn以及选择框一起组一样,在图像中的问题。我在设计部分需要帮助。@FridayAmeh我在问题中附上了一张图片。我想在设计方面得到帮助。事实上,我的问题是它的设计。你能与teamviewer连接吗?。我会解释我的问题,这样单选按钮功能正常吗?所以你需要像图中那样的设计?是的。单选按钮工作正常。刚才我做了一个设计,给我10分钟,我可以在输出图片上帮助设计。请在Sidharth进行upvote,您有超过15分需要upvote:)