【问题标题】:Select box fullscreen jquery bootstrap选择框全屏 jquery 引导程序
【发布时间】:2015-04-22 18:19:15
【问题描述】:

我找到了手机全屏的selextbox方法。

http://craftpip.github.io/bootstrap-fullscreen-select/

但是,当我在选择框上添加表单操作并单击选择选项时,弹出窗口会打开,在我选择某个值之前,它会直接重定向到表单操作。

知道如何解决这个问题吗?

<link href="http://www.jqueryscript.net/demo/Mobile-First-Fullscreen-Select-Replacement-with-jQuery-Bootstrap/css/bootstrap-fullscreen-select.css" rel="stylesheet" type="text/css">
<form action="index.html">
    <select class="form-control example-1" >
    <option value="JavaScript">JavaScript</option>
    <option value="C++">C++</option>
    <option value="Swift">Swift</option>
    <option value="Ruby">Ruby</option>
    <option value="Python">Python</option>
</select>

  </form>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<script src="http://www.jqueryscript.net/demo/Mobile-First-Fullscreen-Select-Replacement-with-jQuery-Bootstrap/js/bootstrap-fullscreen-select.js"></script>
<script>
$('.example-1').mobileSelect();
$('.example-2').mobileSelect({theme: 'holo',style: 'btn-danger'});
$('.example-3').mobileSelect({theme: 'mac', animation: 'zoom'});
</script>

【问题讨论】:

  • 我建议发布你的代码实现,html和js
  • 我已经添加了我使用的代码。
  • jsfiddle.net/4a631pkk/10 也是一个 jsfiddle

标签: javascript jquery css twitter-bootstrap select


【解决方案1】:

有趣,我从来没有使用过这个插件,所以我不得不挖掘一下源代码。无论如何,您的本机选择正在转换为按钮。表单中的按钮将提交。把这个 sn-p 添加到你自己的 js 文件中。

$(document).ready(function(){
    $('.btn-mobileSelect-gen').attr('type', 'button');
});

我在这里叉了你的小提琴 - working demo

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2018-12-15
    • 2019-03-17
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多