gpt4 book ai didi

javascript - 需要在多个 Div 框 onClick 上使用函数

转载 作者:行者123 更新时间:2023-11-28 08:06:32 25 4
gpt4 key购买 nike

这仅适用于 IE。我有一个下面提到的函数,它会在单击 div 时复制 div 的内容。效果很好。它使用了 getElementById。我有 19 个项目,我想用它来...'选项 1 - 选项 19。除了必须创建 19 个变量之外,还有其他方法可以做到这一点吗?我对这些东西完全是菜鸟......

function CopyToClip() {
var Cdiv = document.getElementById('option1');
Cdiv.contentEditable = 'true';
var controlRange;
if (document.body.createControlRange) {
controlRange = document.body.createControlRange();
controlRange.addElement(Cdiv);
controlRange.execCommand('Copy');
}
div.contentEditable = 'false';
}

我应该提到这些 id 用于 Div。这些 div 是基于下拉选择的显示/隐藏。下拉菜单有其 on 功能来显示所选的 div。其功能是:

$(window).load(function () {
$(document).ready(function () {
$('.block').hide();
$('#option1').show();
$('#selectField').change(function () {
$('.block').hide();
$('#' + $(this).val()).fadeIn();
});
});
});

我的 HTML 是:

<div class="col_1">
<h1>communication:</h1>
<div class="box">
<select id="selectField" style="padding-left: 20px;width:175px">
<option value="option1">Device Shipped to ASC</option>
<option value="option2">Device Received at ASC</option>
<option value="option3">ASC Shipped Device to Store</option>
<option value="option4">Device Pick-up Follow-up</option>
<option value="option5">Device Pick-up Final Reminder</option>
<option value="option6">Impress Phase Direct Feedback</option>
<option value="option7">Abandon Notice</option>
<option value="option8">Mailer Shipped to Client</option>
<option value="option9">Mailer Received by Client</option>
<option value="option10">Mailer Pick-up Notice</option>
<option value="option11">Mailer Final Pick-up Notice</option>
<option value="option12">Mailer Failed to Pick-up</option>
<option value="option13">Mailer Return Defective Device Notice</option>
<option value="option14">Mailer Final Return Defective Device Notice</option>
<option value="option15">Mailer Failed to Return Defective Device</option>
<option value="option16">Mailer Defective Device Received at ASC</option>
<option value="option17">Mailer Charges to Customer</option>
<option value="option18">Mailer Process Confirmation</option>
<option value="option19">Quote Un-replied</option>
</select>

<div id="option2" class="block" style="background-color:white" onClick="javascript:CopyToClip()"> blah </div>

如果我有 19 个这样的 div 的话。我不知道这是否有帮助......抱歉,我在这方面超出了我的能力范围。

最佳答案

我不得不进行一些修改,并且您的剪贴板代码无法在所有浏览器上运行:

JSFiddle:http://jsfiddle.net/THU5f/2/

function CopyToClip($div) {
var div = $div[0];
div.contentEditable = 'true';
var controlRange;
if (document.body.createControlRange) {
controlRange = document.body.createControlRange();
controlRange.addElement(div);
controlRange.execCommand('Copy');
alert("Copied: " + div.html());
}
div.contentEditable = 'false';
}

$(function () {
// Hide copy button
$('#copy').hide();
// Hide all content divs
$('.content').hide();

$('#selectField').change(function () {
// Show the copy button
$('#copy').show();
// Hide all content divs
$(".content").fadeOut();
// Show the select content div
$('#' + $(this).val()).fadeIn();
});
$('#copy').click(function(){
// Get the div the current selection points to
var $div = $('#' + $('#selectField').val());
// Copy the div to the clipboard
CopyToClip($div);
});

});

我在全文中添加了评论。希望这会有所帮助。

关于javascript - 需要在多个 Div 框 onClick 上使用函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24738179/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com