复制到剪贴板仅在第二次单击按钮

时间:2015-06-23 18:49:35

标签: javascript jquery copy clipboard zeroclipboard

复制到剪贴板仅在我第二次单击脚本中的按钮后才能工作。我正在使用ZeroClipboard。见here

<head>
    <title>Gerador de Short URL</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <script src="jquery.js" type="text/javascript"></script>
    <script src="jquery.form.js" type="text/javascript"></script>
    <!--script src="short.js" type="text/javascript"></script-->
    
<script>
$(document).ready(function(){
    $('<img src="ajax-loader.gif"/>');
    $('#btnEnviar').click(function(){
        if($('input[name=url]').val() != "") {
            var loader = 'ajax-loader.gif';
            var span_img = '<img src="'+loader+'" />';          
            $('#resposta').html(span_img);
            $('#formShort').ajaxForm({
                success: function(data) {                
                    if(data.sucesso == true){
                        $('#resposta').empty();
                        $('#resposta').append('<input type="text" name="shorturl" id="shorturl" value="' + data.msg + '"/></br></br><label>Link para teste: </label><a target="_blank" href="'+ data.msg +'">' + data.msg + '</a></br></br><input type="button" id="copy" name="copy" value="Copiar link" />');
                        $('#formShort input[name=url]').val('');
                        $('#shorturl').select();
                    }
                    else{
                        $('#resposta').html(data.msg);
                    }                
                },
                error : function(){
                    $('#resposta').html('Erro ao enviar requisi&ccedil;&atilde;o!');
                },
                dataType: 'json',
                url: 'short_url.php'
            }).submit();
        } else {
            $('#resposta').html('Por favor, informe a URL para o encurtamento!');
        }
    });
});
</script>

    <script src="ZeroClipboard.js" type="text/javascript"></script>
    <link rel='stylesheet' href='style.css' type='text/css'/>
    <link rel="shortcut icon" href="http://www.wkimob.com.br/wp-content/themes/RealEstast/assets/img/icon/favicon.ico" type="image/x-icon" />
</head>
<body>
    <div class="geral">
        <div class="header">
            <a target="_blank" href="https://bitly.com/u/walkernolasco">Lista de links</a>
        </div>
        <div class="content">
            <table align="center" width="100%" border="0">
                <tr>
                    <td>
                        <table align="center" border="0">
                            <tr>
                                <td>
                                    <fieldset>
                                    <legend>Gerador de Short URL</legend>
                                        <form name="formShort" id="formShort" method="post">
                                            <label>Informe a URL: </label>
                                            <input type="text" name="url" id="url" /><br><span class="exemplo"><i>Exemplo: http://www.dominio.com.br</i></span></br></br>
                                            <input type="button" name="btnEnviar" id="btnEnviar" value="Encurtar URL" /></br></br>
                                        </form>
                                    </fieldset>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <fieldset>
                                        <legend>Short Link</legend>
                                        <div id="resposta"></div>                                           
                                    </fieldset>
                                </td>
                            </tr>
                        </table>
                    </td>
                </tr>
            </table>
        </div>
        <div class="footer">
            <table align="center" width="100%" border="0">
                <tr>
                    <td align="center" style="font-size:10px;color:#9b9b9b;">&copy; <?php echo date('Y'); ?> WKImob - Negócios Imobiliários | Todos os direitos reservados | Deus seja louvado.&nbsp;<a href="http://www.wkimob.com.br" target="_blank">www.wkimob.com.br</a></td>
                </tr>
            </table>
        </div>
    </div>
    <script type="text/javascript">
        $(document).ready(function() {
            $("#resposta").on('click', '#copy', function(e) {               
                e.preventDefault();
                ZeroClipboard.setMoviePath('http://short.wkimob.com.br/ZeroClipboard.swf');
                var clip = new ZeroClipboard.Client();
                clip.addEventListener('mousedown', function() {
                    clip.setText($('#shorturl').val());
                });
                clip.addEventListener('complete', function(client, text) {
                    alert('copied: ' + text);
                });
                clip.glue($('#copy').attr('id'));
            });
        });
    </script>
</body>

每当我第一次驾驶复制链接按钮时,都没有任何反应。它仅在第二次点击后才有效。

任何人都可以帮助我吗? 拥抱和感谢。

0 个答案:

没有答案