search
HomeBackend DevelopmentPHP Tutorialjavascript - ZeroClipboard为什么点击两次才能成功呢?上全部代码

<code>


    <meta charset="UTF-8">
    <title>插件</title>

    <script src="ZeroClipboard.min.js"></script>
    <script>

        function setCopyClip(id) 
        { 
            clip = new ZeroClipboard.Client(); //初始化对象  
            ZeroClipboard.setMoviePath("ZeroClipboard.swf");
            clip.setHandCursor( true );   //设置手型
            var oA   = document.getElementById(id);
            var code = oA.getAttribute('data-code');
            clip.setText(code); 
            clip.addEventListener('complete', function (client) {  //创建监听事件  
            alert('复制成功!');
            });  
            clip.glue(id); //将flash覆盖至指定ID的DOM上  
        }  

        window.onload=function()
        {
            var aA = document.getElementsByTagName('a');
            for (var i = 0; i < aA.length; i++) 
            {
                aA[i].onclick=function()
                {
                   setCopyClip(this.id)
                }
            }
        }           
</script>



    <p class="intro">券号:BBBzc1234567A473D00051
    <br>
    <a href="javascript:;" class="hdl-copymemcode" id="BBBzc1234567A473D00051" data-code="BBBzc1234567A473D00051">复制券号</a>         
    <br>使用状况:还未开始或已过期                       
    </p>

    <p class="intro">券号:AAAzc1234567A473D00051
    <br>
    <a href="javascript:;" class="hdl-copymemcode" id="AAAzc1234567A473D00051" data-code="AAAzc1234567A473D00051">复制券号</a>
    <br> 使用状况:还未开始或已过期                       
   </p>



</code>

回复内容:

<code>


    <meta charset="UTF-8">
    <title>插件</title>

    <script src="ZeroClipboard.min.js"></script>
    <script>

        function setCopyClip(id) 
        { 
            clip = new ZeroClipboard.Client(); //初始化对象  
            ZeroClipboard.setMoviePath("ZeroClipboard.swf");
            clip.setHandCursor( true );   //设置手型
            var oA   = document.getElementById(id);
            var code = oA.getAttribute('data-code');
            clip.setText(code); 
            clip.addEventListener('complete', function (client) {  //创建监听事件  
            alert('复制成功!');
            });  
            clip.glue(id); //将flash覆盖至指定ID的DOM上  
        }  

        window.onload=function()
        {
            var aA = document.getElementsByTagName('a');
            for (var i = 0; i < aA.length; i++) 
            {
                aA[i].onclick=function()
                {
                   setCopyClip(this.id)
                }
            }
        }           
</script>



    <p class="intro">券号:BBBzc1234567A473D00051
    <br>
    <a href="javascript:;" class="hdl-copymemcode" id="BBBzc1234567A473D00051" data-code="BBBzc1234567A473D00051">复制券号</a>         
    <br>使用状况:还未开始或已过期                       
    </p>

    <p class="intro">券号:AAAzc1234567A473D00051
    <br>
    <a href="javascript:;" class="hdl-copymemcode" id="AAAzc1234567A473D00051" data-code="AAAzc1234567A473D00051">复制券号</a>
    <br> 使用状况:还未开始或已过期                       
   </p>



</code>

给你说下程序执行的流程吧:

  1. 页面初始化时, <a></a>元素有onclick事件;
  2. 第一次点击, 触发onclick事件, 调用setCopyClip函数后, 绑定一个ZeroClipboard.Client对象;
  3. 这条是重点 : 在new ZeroClipboard.Client时, ZeroClipboard会创建一个div元素覆盖在<a></a>元素之上;
  4. 第二次点击, 因为ZeroClipboard创建的div<a></a>元素之上, 所以不会触发onclick事件;
  5. 第一次绑定的ZeroClipboard.Client对象触发complete事件, 弹出复制成功!弹窗.

PS:你用的ZeroClipboard版本很老的吧...

Statement
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
What are some common problems that can cause PHP sessions to fail?What are some common problems that can cause PHP sessions to fail?Apr 25, 2025 am 12:16 AM

Reasons for PHPSession failure include configuration errors, cookie issues, and session expiration. 1. Configuration error: Check and set the correct session.save_path. 2.Cookie problem: Make sure the cookie is set correctly. 3.Session expires: Adjust session.gc_maxlifetime value to extend session time.

How do you debug session-related issues in PHP?How do you debug session-related issues in PHP?Apr 25, 2025 am 12:12 AM

Methods to debug session problems in PHP include: 1. Check whether the session is started correctly; 2. Verify the delivery of the session ID; 3. Check the storage and reading of session data; 4. Check the server configuration. By outputting session ID and data, viewing session file content, etc., you can effectively diagnose and solve session-related problems.

What happens if session_start() is called multiple times?What happens if session_start() is called multiple times?Apr 25, 2025 am 12:06 AM

Multiple calls to session_start() will result in warning messages and possible data overwrites. 1) PHP will issue a warning, prompting that the session has been started. 2) It may cause unexpected overwriting of session data. 3) Use session_status() to check the session status to avoid repeated calls.

How do you configure the session lifetime in PHP?How do you configure the session lifetime in PHP?Apr 25, 2025 am 12:05 AM

Configuring the session lifecycle in PHP can be achieved by setting session.gc_maxlifetime and session.cookie_lifetime. 1) session.gc_maxlifetime controls the survival time of server-side session data, 2) session.cookie_lifetime controls the life cycle of client cookies. When set to 0, the cookie expires when the browser is closed.

What are the advantages of using a database to store sessions?What are the advantages of using a database to store sessions?Apr 24, 2025 am 12:16 AM

The main advantages of using database storage sessions include persistence, scalability, and security. 1. Persistence: Even if the server restarts, the session data can remain unchanged. 2. Scalability: Applicable to distributed systems, ensuring that session data is synchronized between multiple servers. 3. Security: The database provides encrypted storage to protect sensitive information.

How do you implement custom session handling in PHP?How do you implement custom session handling in PHP?Apr 24, 2025 am 12:16 AM

Implementing custom session processing in PHP can be done by implementing the SessionHandlerInterface interface. The specific steps include: 1) Creating a class that implements SessionHandlerInterface, such as CustomSessionHandler; 2) Rewriting methods in the interface (such as open, close, read, write, destroy, gc) to define the life cycle and storage method of session data; 3) Register a custom session processor in a PHP script and start the session. This allows data to be stored in media such as MySQL and Redis to improve performance, security and scalability.

What is a session ID?What is a session ID?Apr 24, 2025 am 12:13 AM

SessionID is a mechanism used in web applications to track user session status. 1. It is a randomly generated string used to maintain user's identity information during multiple interactions between the user and the server. 2. The server generates and sends it to the client through cookies or URL parameters to help identify and associate these requests in multiple requests of the user. 3. Generation usually uses random algorithms to ensure uniqueness and unpredictability. 4. In actual development, in-memory databases such as Redis can be used to store session data to improve performance and security.

How do you handle sessions in a stateless environment (e.g., API)?How do you handle sessions in a stateless environment (e.g., API)?Apr 24, 2025 am 12:12 AM

Managing sessions in stateless environments such as APIs can be achieved by using JWT or cookies. 1. JWT is suitable for statelessness and scalability, but it is large in size when it comes to big data. 2.Cookies are more traditional and easy to implement, but they need to be configured with caution to ensure security.

See all articles

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Tools

SecLists

SecLists

SecLists is the ultimate security tester's companion. It is a collection of various types of lists that are frequently used during security assessments, all in one place. SecLists helps make security testing more efficient and productive by conveniently providing all the lists a security tester might need. List types include usernames, passwords, URLs, fuzzing payloads, sensitive data patterns, web shells, and more. The tester can simply pull this repository onto a new test machine and he will have access to every type of list he needs.

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SAP NetWeaver Server Adapter for Eclipse

SAP NetWeaver Server Adapter for Eclipse

Integrate Eclipse with SAP NetWeaver application server.

SublimeText3 Linux new version

SublimeText3 Linux new version

SublimeText3 Linux latest version

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)