将值从表行复制到剪贴板(PHP,SQL和JS)

时间:2017-06-09 08:56:48

标签: javascript php html mysql copy

有一个不同的问题,有人将其标记为重复,但事实并非如此。

我创建了一个PHP文件,显示我保存在数据库中的所有图像(PHPmyadmin中的mySQL): enter image description here

我的想法是当我点击按钮时,图像链接($ onoma)被复制到剪贴板中。所以,我创建了一个不可见的<p>,我从那里获得了复制值。

它在单个html文件(静态行)中工作正常,但在我的PHP文件中,它复制了每行的所有图像链接并将它们连接起来。

我已粘贴下面的代码(仅限“图片预览”和“复制到剪贴板”列),因为我无法使用PHP代码段:

    <?php       
    $co=0;
    while($row = mysql_fetch_array($result))
    {
    $onoma=$row['filename'];

    $res=mysql_query($sql);
    $count=mysql_num_rows($res);
    $co++;

    ?>
            <script>
            function copyToClipboard(element) {
              var $temp = $('<input>');
              $('body').append($temp);
              $temp.val($(element).text()).select();
              var gamo = <?php echo json_encode("copy$co"); ?>;
              document.execCommand($gamo);
              $temp.remove();
            </script>   
    <?php 
            echo "
            <tr>
                <td>
                    <img src=\"$onoma\" />
                </td>
                <td>
                    <p style=\"visibility: hidden;\" class=\"copy$co\">$onoma</p>
                    <div id=\"button\" onclick=\"copyToClipboard('copy$co')\">COPY</div>
                </td>
            </tr>
        "; 
    }
    mysql_close();          
?>      

它不会复制任何东西。在控制台中,我收到此错误:enter image description here

完全实现此脚本后:enter image description here

2 个答案:

答案 0 :(得分:0)

chnage document.execCommand($gamo);document.execCommand(gamo);

答案 1 :(得分:0)

该命令不能是动态的。我不小心使命令动态化,因为它与类具有相同的名称。这一行:document.execCommand("copy$co");错了。更正如下所示:

        function copyToClipboard<?php echo "$co";?>(element<?php echo "$co";?>) {
            var $temp = $("<input>");
           $("body").append($temp);
           $temp.val($(element<?php echo "$co";?>).text()).select();
           document.execCommand("copy");
           $temp.remove();
        }