原始帖子

是否可以通過下拉CSS菜單運行js函數？是否可以通過下拉CSS菜單運行js函數？

我會實現一個菜單，看起來像習慣性的導航菜單，而是針對每個項目運行不同的JavaScript函數，或者我認爲這是同樣的事情，將不同的參數傳遞給函數，運行。

是否可行？谷歌搜索，我挑相反（通過JS下拉菜單）...

編

由於一些周到成員提供的建議，我已經解決了我的問題，事件處理程序連接到菜單的每個項目。因此我在這裏發佈代碼。再次感謝。

<HTML> 
<HEAD> 
<TITLE></TITLE> 

<style> 
<!--http://www.w3schools.com/css/css_dropdowns.asp--> 
.dropbtn { 
    background-color: #4CAF50; 
    color: white; 
    padding: 16px; 
    font-size: 16px; 
    border: none; 
    cursor: pointer; 
} 

.dropdown { 
    position: relative; 
    display: inline-block; 
} 

.dropdown-content { 
    display: none; 
    position: absolute; 
    background-color: #f9f9f9; 
    min-width: 160px; 
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); 
} 

.dropdown-content a { 
    color: black; 
    padding: 12px 16px; 
    text-decoration: none; 
    display: block; 
} 

.dropdown-content a:hover {background-color: #f1f1f1} 

.dropdown:hover .dropdown-content { 
    display: block; 
} 

.dropdown:hover .dropbtn { 
    background-color: #3e8e41; 
} 

#myvar{ 
margin-top: 200px; 
} 
</style> 

<script type="text/javascript"> 
    function setVar(arg){ 
     document.getElementById("myvar").innerHTML = arg; 
    } 
</script> 

<script> 
    var x = 0; 
</script> 

</HEAD> 

<BODY onLOad="setVar(x)"> 

<div class="dropdown"> 
    <span>menu</span> 
    <div id = "menudd" class="dropdown-content"> 
    <p onClick="setVar(1)">item 1</p> 
    <p onClick="setVar(2)">item 2</p> 
    <p onClick="setVar(3)">item 3</p> 
    </div> 
</div> 

<p onClick="setVar(3)">again 3</p> 

<P id="myvar"></P> 

</BODY> 
</HTML>

來源

2016-01-23 PoincareConjecture

更清楚地解釋它 –

不，不可能爲此使用CSS。但您可以使用JS事件處理程序來運行js函數...... – Bergi

我不認爲可以使用CSS來運行JavaScript，但可以將'javascript：doSomeJavaScriptHere（）'作爲鏈接的'href'屬性添加。 –

我不知道你是什麼意思的「CSS菜單」。你不用CSS創建菜單;你用HTML創建它們。你用CSS來設計它們，並使它們看起來像菜單一樣。

所有基於HTML的Web應用程序都基於附加到HTML元素（如按鈕或菜單項）的行爲（以JS實現）。

將click事件的事件處理程序附加到表示特定菜單項的HTML元素，並提供要執行的任何函數。

來源

2016-01-23 14:54:51

是否可以通過下拉CSS菜單運行js函數？

原始帖子

編

回答

相關問題