js 复制某一个div中的内容

仅支持IE, 不支持 FireFox

     function copyToClipboard() {
        try {
            var txt = document.getElementById("divLog").innerText;
            window.clipboardData.setData('text', txt);
            alert('Copy Done,use "Ctrl+V" to paste!');
        } catch (e) {
            alert('Your browser can not support clipboard, please copy the content by your self!');
        }
    }


mvc4, razor 中 .cshtml 部分前端代码:

    @if (Model != null)
    {
        <div style="width: 95%">
            <h4>
                Review Log</h4>
            <table style="border:0;width:100%">
                <tr>
                    <td align="right" width="5%">
                        <input type="button" value="Click to Copy" οnclick="copyToClipboard();" />
                    </td>
                </tr>
                <tr>
                    <td>
                        <div id="divLog" style="border: 1px solid gray; width: 100%; height: 200px; line-height: 200px;
                            overflow: auto; overflow-x: hidden;">
                            <table>
                                <tr>
                                    <td>
                                        @foreach (var item in Model.LstPkgRV_Log)
                                        {
                                            @Html.Raw(item.Log.ToString())
                                        }
                                    </td>
                                </tr>
                            </table>
                        </div>
                    </td>
                </tr>
            </table>
        </div>
    }


在Web开发,使用循环来创建多个`div`元素,并通过点击事件改变某个`div`的背景色是一种常见的操作。这通常可以通过JavaScript结合HTML和CSS来实现。下面是一个简单的实现步骤: 1. 使用HTML创建一个容器元素,例如`div`,用于包含所有的子`div`元素。 2. 使用JavaScript(可以结合循环结构如`for`或`while`)动态地创建多个子`div`元素,并将它们添加到容器元素。 3. 为每个子`div`元素添加一个点击事件监听器。 4. 在事件处理函数,改变被点击`div`的背景色。 这里给出一个简单的示例代码: HTML部分: ```html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>点击改变背景色</title> <style> .container { display: flex; flex-wrap: wrap; justify-content: center; } .clickable-div { width: 100px; height: 100px; margin: 5px; display: flex; align-items: center; justify-content: center; cursor: pointer; } </style> </head> <body> <div id="container" class="container"></div> <script> // JavaScript代码将在这里编写 </script> </body> </html> ``` JavaScript部分: ```javascript // 假设我们要创建10个div元素 for (let i = 0; i < 10; i++) { const div = document.createElement('div'); div.className = 'clickable-div'; div.textContent = '点击我'; div.onclick = function() { this.style.backgroundColor = '#' + Math.floor(Math.random()*16777215).toString(16); }; document.getElementById('container').appendChild(div); } ``` 在这个示例,我们创建了一个`container`元素用于存放子`div`,并通过循环创建了10个可点击的子`div`。每个子`div`在被点击时会随机改变其背景色。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值