li onclick function not getting called
Question
I have trouble calling the onclick function inside the li element.when I put a url to the href it works fine. But I want to call a javascript function through onclick .Any help is appreciated.
function display_s(){ alert("success"); }
<div style="" class="icon_bar"> <ul style="padding:0 ; margin : 0;display:flex; justify-content: center;"> <li onclick="display_specs()"> <a href="#" > <div style="display:flex;align-items:center;flex-direction:column"> <div style="height:35px;width:35px;padding:5px"> <img src="/static/phone.bmp" style="max-width:100%;height:auto"></div> <div style="padding:5px" > Mobile</div> </div> </a> </li> </ul> </div>
4 answers
solution1
2 ACCPTED 2019-06-21 05:45:05
Change to what I type. You have some type error.
function display_specs(){ alert("success"); }
<div style="" class="icon_bar"> <ul style="padding:0 ; margin : 0;display:flex; justify-content: center;"> <li onclick="display_specs()"> <a href="#" > <div style="display:flex;align-items:center;flex-direction:column"> <div style="height:35px;width:35px;padding:5px"> <img src="/static/phone.bmp" style="max-width:100%;height:auto"></div> <div style="padding:5px" > Mobile</div> </div> </a> </li> </ul> </div>
solution2
1 2019-06-21 05:54:05
You're onclickfucntion name and in script tag name must be same like that. Also if you wanna learn more information about onClick you can check this link
function display_specs(){ alert("success"); }
<div style="" class="icon_bar"> <ul style="padding:0 ; margin : 0;display:flex; justify-content: center;"> <li onclick="display_specs()"> <a href="#" > <div style="display:flex;align-items:center;flex-direction:column"> <div style="height:35px;width:35px;padding:5px"> <img src="/static/phone.bmp" style="max-width:100%;height:auto"></div> <div style="padding:5px" > Mobile</div> </div> </a> </li> </ul> </div>
solution3
1 2019-06-21 05:57:54
Call the function in li and it will work.
<script>
function display_s()
{
alert('check');return false;
}
</script>
</head>
<body>
<div style="" class="icon_bar">
<ul style="padding:0 ; margin : 0;display:flex; justify-content: center;">
<li onclick="display_s()" style="cursor:pointer"></li>
</ul>
</div>
</body>
solution4
1 2019-06-21 06:13:30
You are calling to the wrong function which is not defined. when you are click on
liyou should call to the functiondisplay_s().
function display_s(){ alert("success"); }
<div style="" class="icon_bar"> <ul style="padding:0 ; margin : 0;display:flex; justify-content: center;"> <li onclick="display_s()"> <a href="#" > <div style="display:flex;align-items:center;flex-direction:column"> <div style="height:35px;width:35px;padding:5px"> <img src="/static/phone.bmp" style="max-width:100%;height:auto"></div> <div style="padding:5px" > Mobile</div> </div> </a> </li> </ul> </div>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.