2017-06-08 19 views
0

下面是我標記的HTML代碼,但每當我加載頁面時,選擇標記都不會出現。我相信我已經包含了所有必要的鏈接,當我從select標籤中刪除.selectpicker類時,它通常會出現,所以我必須錯過某些爲什麼沒有出現的東西。謝謝!我無法獲得引導選擇的.selectpicker類的工作,任何想法爲什麼?

<!doctype html> 
 

 
<html lang="en"> 
 

 
<head> 
 

 

 
    <meta charset="utf-8"> 
 

 
    <title>Test</title> 
 
    <meta name="description" content="The HTML5 Herald"> 
 
    <meta name="author" content="SitePoint"> 
 

 
    <link rel="stylesheet" href="css/styles.css?v=1.0"> 
 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.2/css/bootstrap-select.min.css"> 
 

 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.2/js/bootstrap-select.min.js"></script> 
 

 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.2/js/i18n/defaults-*.min.js"></script> 
 

 

 

 
    <!--[if lt IE 9]> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.js"></script> 
 
    <![endif]--> 
 
</head> 
 

 
<body> 
 
    <select class="selectpicker" style="btn-info"> 
 
     <option>Mustard</option> 
 
     <option>Ketchup</option> 
 
     <option>Relish</option> 
 
    </select> 
 

 
    <script> 
 
     $('.selectpicker').selectpicker({ 
 
      style: 'btn-info', 
 
      size: 4 
 
     }); 
 

 
    </script> 
 
</body> 
 

 
</html>

+0

代碼我改變了選擇標籤的「風格」屬性「數據式」,仍然沒有改變。 –

回答

0

您不包括正確的CSS和Java腳本libraries-

請檢查下面的代碼 - 它工作正常,你可以添加多個,讓用戶選擇多個值,還可以包含搜索選項,如果有一長串選項,請嘗試data-live-search-style =「startsWith」。

請如下─

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <title>Test</title> 
    <meta name="description" content="The HTML5 Herald"> 
    <meta name="author" content="SitePoint"> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.1/css/bootstrap-select.css" /> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.1/js/bootstrap-select.js"></script> 

</head> 

<body> 

<select class="selectpicker" multiple style="btn-info"> 
    <option>Mustard</option> 
    <option>Ketchup</option> 
    <option>Relish</option> 
</select> 

相關問題