时间戳

首页 > 解决方案 > 在 JQuery/Javascript 中显示 Div

javascript - 在 JQuery/Javascript 中显示 Div

问题描述

有谁知道如何在 javascript 中使用函数 test () 在 JQuery 中将我的 Div 显示为透明？提前致谢。

function test() {
     document.getElementById("transparent").onclick; //ERROR
    } 
    <head>
    <meta charset="utf-8">
    <title>Example</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
    <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
    </head>
    
    <body>
    <div data-role="page" id="page">
    
    <div data-role="content">
    <a href="#transparent" data-rel="popup" data-position-to="window" data-transition="pop" data-role="button">IMAGE</a>
    <a onClick="test()" data-role="button">test</a>  
    </div>
    	
    <div id="transparent" data-role="popup" data-theme="none" data-shadow="false">
    <img src="a.png" class="popphoto" alt="Teste" width="300" height="300">
    </div>
    </div> 
    </body>

标签： javascriptjquery

解决方案

上面的方法很好。但更准确地说，JQuery 中快速而肮脏的解决方案是这样的

$("#exec").on("click", function() {
           $("#transparent").css("opacity", "0.5"); 
    });
    <!doctype html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>Example</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
    <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
    </head>
    
    <body>
    <div data-role="page" id="page">
    
    <div data-role="content">
    <a href="#transparent" data-rel="popup" data-position-to="window" data-transition="pop" data-role="button">IMAGE</a>
    <a id="exec" data-role="button">test</a>  
    </div>
    
    <div id="transparent" data-role="popup" data-theme="none" data-shadow="false">
    <img src="a.png" class="popphoto" alt="Teste" width="300" height="300">
    </div>
    </div> 
    </body>
 </html>

单击超链接后，它会直接设置 div 的 css

推荐阅读