您能否告知如何实现引导 btn 组元素,该元素由一个提交按钮组成,其余按钮用作复选框。实际上我已经创建了提到的,但我的提交按钮不起作用,当按下它时,没有任何反应。 这是我现在拥有的:
<form class="form-group" action ="" method = "get" novalidate>
<div class="btn-group-vertical" data-toggle="buttons">
<button type="submit" class="btn btn-success">Search</button>
<label class="btn btn-primary">
<input type="checkbox" name="select_tag" value="2" id="id_select_tag_0" /> Mysql
</label >
<label class="btn btn-primary">
<input type="checkbox" name="select_tag" value="3" id="id_select_tag_1" /> Disk health
</label2>
</div>
</form>
块看起来像这样
如果我将提交按钮从 btn 组块中取出,它可以工作:
<form class="form-group" action ="" method = "get" novalidate>
<button type="submit" class="btn btn-success">Search</button>
...
然而,它看起来很丑
那么是否可以让很多按钮作为一个复选框工作,一个按钮在一个引导按钮组中作为提交工作?
你可以用javascript来做:
<form class="form-group" action ="" method = "get" novalidate>
<div class="btn-group-vertical" data-toggle="buttons">
<button type="button" onClick="javascript:document.forms[0].submit();" class="btn btn-success">Search</button>
<label class="btn btn-primary">
<input type="checkbox" name="select_tag" value="2" id="id_select_tag_0" /> Mysql
</label >
<label class="btn btn-primary">
<input type="checkbox" name="select_tag" value="3" id="id_select_tag_1" /> Disk health
</label2>
</div>
</form>
看起来您的表单元素中有一些奇怪的空格,并且没有设置操作。
尝试替换:
<form class="form-group" action ="" method = "get" novalidate>
跟
<form class="form-group" action="#" method="get" novalidate>
只需删除data-toggle="buttons"
试试这个 - 更改按钮的类:class="btn btn-success submit"