我已成功确定代码中的错误。我必须说,真的很奇怪。当然,在有人说google之前,我有hehehe。我只是想知道这是不是一个bug,或者是否有一些解决方案。
我有一个表单,我想在其中编辑一些内容并将其发送到服务器。问题是,当我尝试聚焦一个领域(点击它)时,我做不到。由于某种原因它被禁用。不仅是输入,还包括选择框和复选框。但是,如果我将textarea作为其子项从 col-sm-12 更改为 col-sm-11 的div类,那么就可以正常工作。现在我不想使用大小为11的列,其他一切都可以是12.看起来很奇怪。
这是我的代码:
<form>
<div class="form-group col-xs-12 col-sm-6 col-md-6 col-lg-6">
<label for="title" >Title</label>
<input type="input" name="title" class="form-control" value="<?php echo $article['title'] ?>">
</div>
...
...
<div class="form-group col-xs-12 col-sm-12 col-md-12 col-lg-12">
<label for="content" >content</label>
<textarea name="content" class="form-control" rows="3"><?php echo $article['content'] ?></textarea>
</div>
<div class="form-group col-xs-12 col-sm-6 col-md-6 col-lg-2">
<input type="submit" name="submit" class="btn btn-success form-control" value="Save!"/>
</div>
...
</form>
有人对此有所了解吗?
答案 0 :(得分:8)
我今天遇到过这个问题。文本输入不会集中于单击,并且clearfix div不起作用。
解决方案是将每个col-xx-x包装在一个带有.row类的div中。例如:
<div class="row">
<div class="form-group col-xs-12 col-sm-12 col-md-12 col-lg-12">
<label for="content" >content</label>
<textarea name="content" class="form-control" rows="3"></textarea>
</div>
</div>
答案 1 :(得分:0)
我遇到了同样的问题。无.clearfix或将每个col-xx-x包装在具有行类的div中。然而,在包含行类的div中包装表单标记确实解决了这个问题。
<div class="row">
<form>
.
.
.
</form>
</div>
答案 2 :(得分:0)
我有同样的问题,添加div行后仍无法正常工作。我将此代码添加到样式css以解决问题:
.col-md-12{
width: 100% !important;
}
添加到所有col-xx-12
答案 3 :(得分:0)
问题是有一个div或一些其他元素与输入控件重叠。您应该能够切换到输入元素,即使您无法单击它。尝试访问此stackoverflow帖子:Bootstrap 3 form not working on mobile devices。