Bootstrap 3 - Dropdown Select
by NunoMira
HTML
<link rel="stylesheet" href="http://getbootstrap.com/dist/css/bootstrap.css">
<script src="http://getbootstrap.com/dist/js/bootstrap.js"></script>
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css">
<div class="form-group">
<div class="dropdown dropLang">
<button class="btn btn-default" data-toggle="dropdown">
<span class="langSelect">PT</span>
<span class="caret"></span>
</button>
<ul class="dropdown-menu">
<li><a href="#">Portugues</a></li>
<li><a href="#">Ingles</a></li>
<li><a href="#">Francês</a></li>
<li><a href="#">Espanhol</a></li>
</ul>
</div>
</div>
<br>
<br>
<select>
<option value="volvo">Portugues</option>
<option value="saab">Ingês</option>
<option value="saab">Francês</option>
<option value="opel">Espanhol</option>
</select>
CSS
/*select bootstrap*/
select:focus
{
outline: 0;
}
.dropLang button
{
border: 0;
border-radius: 0;
}
.dropLang button:focus
{
outline: none!important;
}
/*select HTML*/
select
{
border: 0;
}
JavaScript
//select box em bootstrap sem focus
$(".dropLang").on("click", "li a", function()
{
var language = $(this).text();
$(".langSelect").html(language);
$('#printPlatform').html(language);
});