懸停下拉按鈕

如何使用懸停下拉？我想單擊選擇時顯示值。例如，如果我點擊2，單詞「數字」將變成兩個。我不知道如何使用它，因爲我不知道關鍵詞。懸停下拉按鈕

可以通過這個懸停下拉菜單做了什麼？還是有其他方法？謝謝。

這是我找到的代碼。

<div class="dropdown"> 
<button class="dropbtn" id="drop1" >Number</button> 
    <div class="dropdown-content"> 
      <a href="#">1</a> 
      <a href="#">2</a> 
      <a href="#">3</a> 
      <a href="#">4</a> 
    </div> 
</div>

來源

2017-05-09 Beginner

有人問之前類似的問題，[這裏]（http://stackoverflow.com/questions/ 4599975/html-select-box-options-on-hover）是一個鏈接。 –

使用jQuery你可以用一條線做到這一點：

$("a").click(function(){$("#drop1")[0].innerHTML = this.innerHTML;});

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
</head> 
 
<body> 
 

 
<div class="container"> 
 
    <div class="dropdown"> 
 
    <button class="btn btn-primary dropdown-toggle" id="drop1" type="button" data-toggle="dropdown">Number 
 
    <span class="caret"></span></button> 
 
    <ul class="dropdown-menu" role="menu" aria-labelledby="menu1"> 
 
     <li role="presentation"><a role="menuitem" tabindex="-1" href="#">1</a></li> 
 
     <li role="presentation"><a role="menuitem" tabindex="-1" href="#">2</a></li> 
 
     <li role="presentation"><a role="menuitem" tabindex="-1" href="#">3</a></li> 
 
     <li role="presentation"><a role="menuitem" tabindex="-1" href="#">4</a></li>  
 
    </ul> 
 
    </div> 
 
</div> 
 

 
</body> 
 
</html>

來源

2017-05-09 18:01:47

謝謝，但我希望它作爲HOVER DROPDOWN :)的形式是這樣嗎？ – Beginner

是的，這是我想要的！謝謝！！！ – Beginner

懸停下拉按鈕

回答

相關問題