基本用法: <p>Envelope icon: <span class="glyphicon glyphicon-envelope"></span></p> <p>Search icon: <span…
November 9, 2015
bootstrap 3 下拉条选项 dropdown select
<div class="container"> <div class="form-group"> <label for="platform" class="control-label col-xs-2">Platform:</label> <div class="col-xs-10"> <div class="dropdown" id="dropdownMenu2"> <button class="btn btn-default" data-toggle="dropdown"> <span id="dropdown_title2">Select</span> <span class="caret"></span> </button> <ul class="dropdown-menu" > <li><a tabindex="-1" href="#">Android</a></li> <li><a tabindex="-1" href="#">IOS</a></li> <li><a tabindex="-1" href="#">Windows Phone</a></li> </ul> </div> </div> </div> <div class="form-group"> <label for="printPlatform" class="control-label col-xs-2"> Platform: </label> <div class="col-xs-10"> <span id="printPlatform"></span> </div> </div> <div class="clearfix"></div><br/> <button class="btn btn-primary" id="SendRequest"> Send Request </button> </div> <!-- Post Info --> <div style='position:fixed;bottom:0;left:0; background:lightgray;width:100%;'> About this SO Question: <a href='http://stackoverflow.com/q/25812022/1366033'> Bootstrap JQuery: dropdown menu validation on selected item </a><br/> Fork This Skeleton Here: <a href='http://jsfiddle.net/KyleMit/kcpma/'> Bootstrap 3 Skeleton </a><br/> </div>
$("#dropdownMenu2").on("click", "li a", function() { var platform = $(this).text(); $("#dropdown_title2").html(platform); $('#printPlatform').html(platform); }); $("#SendRequest").click(function() { var platform = $("#dropdown_title2").html(); var isValid = (platform !== 'Select') if (!isValid) { alert('Please fill in missing details'); } else { alert('Thank you for submitting'); } });
原文:http://jsfiddle.net/KyleMit/5p341amh/
本文:bootstrap 3 下拉条选项 dropdown select