发表新帖
发表新帖

Adding an onclick event to a div element

后端 未结
关注
5 489
孤独总比滥情好
孤独总比滥情好 2020-12-24 05:26

I saw a few similar topics which did help but I have specific problem and didn\'t manage to solve it alone so if anyone can help out I would appreciate it

I want to

相关标签:
5条回答
  • 面向向阳花
    2020-12-24 05:35

    I'm not sure what the problem is; running the below works as expected:

    <div id="thumb0" class="thumbs" onclick="klikaj('rad1')">knock knock</div>
​<div id="rad1" style="visibility: hidden">hello world</div>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​
<script>
function klikaj(i) {
    document.getElementById(i).style.visibility='visible';
}
</script>

    See also: http://jsfiddle.net/5tD4P/

    0 讨论(0)
  • 谎友^
    2020-12-24 05:42

    Its possible, we can specify onclick event in 

    <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="thumb0" class="thumbs" onclick="fun1('rad1')" style="height:250px; width:100%; background-color:yellow;";></div>
<div id="rad1" style="height:250px; width:100%;background-color:red;" onclick="fun2('thumb0')">hello world</div>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​
<script>
function fun1(i) {
    document.getElementById(i).style.visibility='hidden';
}
function fun2(i) {
    document.getElementById(i).style.visibility='hidden';
}
</script>
</body>
</html>
    0 讨论(0)
  • 慢半拍i
    2020-12-24 05:43

    Depends in how you are hiding your div, diplay=none is different of visibility=hidden and the opacity=0

    • Visibility then use ...style.visibility='visible'

    • Display then use ...style.display='block' (or others depends how
      you setup ur css, inline, inline-block, flex...)

    • Opacity then use ...style.opacity='1';

    0 讨论(0)
  • 庸人自扰
    2020-12-24 05:45

    I think You are using //--style="display:none"--// for hiding the div.

    Use this code:

    <script>
    function klikaj(i) {
        document.getElementById(i).style.display = 'block';
    }
</script>
<div id="thumb0" class="thumbs" onclick="klikaj('rad1')">Click Me..!</div>
<div id="rad1" class="thumbs" style="display:none">Helloooooo</div>
    0 讨论(0)
  • 小蘑菇
    2020-12-24 05:57

    maybe your script tab has some problem.

    if you set type, must type="application/javascript".

    <!DOCTYPE html>
<html>
    <head>
        <title>
            Hello
        </title>
    </head>
    <body>
        <div onclick="showMsg('Hello')">
            Click me show message
        </div>
        <script type="application/javascript">
            function showMsg(item) {
            alert(item);
        }
        </script>
    </body>
</html>
    0 讨论(0)
 看不清?
提交回复
热议问题