Tag: twitter bootstrap

流程上的Bootstrap Multiselect更新选项列表: 我使用bootstrap multi-select ，我想用ajax更新flow上的选项为了填充init我的多选我做 <option value="” > 然后在事件我想用以下ajax更新我的选项列表我试图使用重建方法但不会在创建后触发下拉列表 $.ajax({ type: ‘post’, url: “helper/ajax_search.php”, data: {models: decodeURIComponent(brands)}, dataType: ‘json’, success: function(data) { $(‘select.multiselect’).empty(); $(‘select.multiselect’).append( $(”) .text(‘alle’) .val(‘alle’) ); $.each(data, function(index, html) { $(‘select.multiselect’).append( $(”) .text(html.name) .val(html.name) ); }); $(‘.multiselect’).multiselect(‘rebuild’) }, error: function(error) { console.log(“Error:”); console.log(error); } }); 使用firebug，我可以看到列表已生成，但选择将不会显示

jquery bootstrap selectpicker基于先前列表选择的刷新列表: 我有三个下拉列表，一个列表在页面加载时填充，不会更改。第2和第3列表可能会根据选择而改变。此function工作正常。我已经尝试将Bootstrap selectpicker添加到选择器中，我可以看到它正在工作 – 遗憾的是列表根据选择没有刷新。我实际上认为“幕后”他们是我可以看到传递的查询，但通过前端没有任何反应。部分HTML：前两个DDL是通过php创建的但是我有以下Javascript： $(document).ready(function() { $(“.selectpicker”).selectpicker(); }); 这是我发现问题的地方，我试图在ajax中对变更函数实现这一点而没有成功 – 甚至不确定它是否正确。 $(‘.selectpicker’).selectpicker(‘refresh’); 我对这一切都很陌生，所以想要一些帮助。

bootstrap typeahead返回名称和id: 海兰！我正在使用twitter bootstraps typeahead：我正在调用一个页面，该页面返回带有json_encode的响应，页面返回一个名称和一个ID，我希望typeahead列表会显示名称列表，当我选择其中一个名称来将id值写入隐藏字段时。调用工作正常，写一个字段应该很容易。我不知道该怎么做是如何将名称与id分开。现在，当我搜索某些东西时，在suggesstion列表中我可以看到返回的结果如下： name1：id1 name2：id2 我只想看到名字，但也要带上id的值。我怎样才能做到这一点？ $(function(){ $(“#typeahead_”).typeahead( { source: function(query, process) { $.ajax({ url: ‘/getAjaxProducts’, type: ‘POST’, data: ‘query=’ + query, dataType: ‘JSON’, async: true, success: function(data) { process(data); } }); } }); });

Bootstrap 3多个菜单合并为一个移动设备: 我已经和菜单争了一段时间了。我想要的是顶级菜单和侧面菜单。并且为了在移动设备上有用，两个菜单都需要折叠成可在手机上访问的内容。这有可能吗？或者我是否必须为不同的屏幕尺寸编写不同的解决方案？谢谢

bootstrap模态在4秒后关闭或用户单击: 如何为引导模式设置超时？获取ajax数据后，php返回的消息包含术语success ，我想给用户关闭窗口的选项。但是，我也想减少4秒钟。目前第二个成功消息回来，模态隐藏自己。 $(‘#forgotform’).submit(function (e) { “use strict”; e.preventDefault(); $(‘#forgotsubmit’).button(‘loading’); var post = $(‘#forgotform’).serialize(); var action = $(‘#forgotform’).attr(‘action’); $(“#message”).slideUp(350, function () { $(‘#message’).hide(); $.post(action, post, function (data) { $(‘#message’).html(data); document.getElementById(‘message’).innerHTML = data; $(‘#message’).slideDown(‘slow’); $(‘#usernamemail’).focus(); if (data.match(‘success’) !== null) { $(‘#forgotform’).slideUp(‘slow’); $(‘#forgotsubmit’).button(‘complete’); $(‘#forgotsubmit’).click(function (eb) { eb.preventDefault(); $(‘#forgot-form’).modal(‘hide’); }); setTimeout($(‘#forgot-form’).modal(‘hide’), 10000); } else { $(‘#forgotsubmit’).button(‘reset’); […]

在引导程序中使列具有相同的高度: 我连续三列。我希望所有三列都具有相同的高度（填满整个空白区域）目前，它看起来像这样：如您所见，左列是正确的高度。中间和右边不是。脚手架看起来像这样： — menu — — gray content — — black content– 我试图给出100％的中间和右侧跨度高度，但这并不是这样。任何人都可以指导我正确的方向吗？我正在使用最新版本的Twitter Bootstrap

当你关闭并重新打开模态时，shown.bs.modal会多次触发: 我已经做了一个小提琴，说明了我目前面临的问题。所以每当我关闭并打开一个模态时， shown.bs.modal也会多次触发。在这个小提琴中，每当你关闭并打开一个模态时，警报的数量也会增加（当它应该只触发一次时）。 http://jsfiddle.net/j36h2/1/ function openTestModal(){ $(‘#testModal’).modal({ keyboard: false, backdrop: ‘static’ }); $(‘#testModal’).on(‘shown.bs.modal’, function (e) { alert(”); }); } $(‘.testButton’).click(function(){ openTestModal(); });

使用bootbox.confirm（）确认表单提交: 我有一个表单，并希望拦截表单提交以使用bootbox显示确认对话框。用户输入一些数据用户点击提交将显示确认对话框如果用户点击OK ，那么表单应该提交，如果不是，它应该只保留在页面上。我试过这个： $(‘#myForm’).submit(function() { return bootbox.confirm(“Are you sure?”); }); 但是， bootbox.confirm()立即返回，再次隐藏确认对话框。然后我注意到bootbox.confirm()上有一个回调参数。但是，如果我要从回调中调用$(‘#myForm’).submit() ，这显然会再次显示确认对话框。那么确认表单提交的正确方法是什么？

Bootstrap按钮在移动设备上“卡住”: 每当我点击一个带有我的移动设备（android）的按钮在twitter的boostrap按钮上，但按钮得到奇怪的样式，就像鼠标仍然结束，直到我点击另一个元素才释放。这不是应用于元素的活动类。它很微妙，但非常烦人，特别是当我尝试将样式应用到他们不会显示的按钮，直到我点击不同的元素。尝试在移动设备上访问http://twitter.github.com/bootstrap/base-css.html#buttons并单击一个按钮，你会看到我的意思我尝试使用jquery触发各种事件但没有任何效果，这是我在我的javascript结束时的片段 $(document).on(‘tapclick’, ‘.btn’, function() { $(this).blur(); $(this).trigger(‘mouseup’); }); 并尝试在hover时重写css样式 .btn a:hover,.btn a:link,.btn a:visited,.btn a:active{ text-decoration: none !important; cursor: default !important; background-color: transparent !important; background-image: none !important; }

垂直中心响应图像: 我想知道是否有一种简单的方法来垂直居中响应图像。请参考以下jsFiddle： http ： //jsfiddle.net/persianturtle/yawTb/1/ 基本HTML：基本CSS： .mobile-title-size { position: absolute; top: 2.5%; left: 6%; width: 70%; max-width: 300px; } 这是使用平板电脑和桌面视口上显示的相同图像的移动标题。由于图像已经被加载了，我希望使用相同的图像，将其调整为较小并垂直对齐，以便我可以将一个图像用于所有视口。问题：在浏览器resize时，图像会变小，但不会在中心垂直对齐。目标：尽管在此示例中宽度严重重叠，但这不是我网站上的问题。目标只是在浏览器resize时垂直居中图像。我可以使用javascript / jQuery解决方案，但当然，首选简单的CSS。任何帮助是极大的赞赏！