我有一个包含6个选项的表单,可以在没有Internet访问权限的驱动器上脱机运行。当用户单击复选框时,它会在textarea中放置一个标题,对于其他选项也是如此。如果未选中复选框,则会从textarea中删除标题。用户在标题下手动添加更多详细信息,点击复制&重置将其复制到剪贴板。它被粘贴在其他地方。
问题 - 选中或取消选中复选框后,它会重置所有其他仅添加标题的自由文本。我不希望这会影响其他数据,只有在未选中该选项时才删除特定标题。
我也希望textarea中的最后一个标题也有几个换行符。帮助赞赏。
JAVASCRIPT
$(function() {
$('input[name=activeOptions]').on('change', function() {
var arr = $('input[name=activeOptions]:checked').map(function () {
return this.value;
}).get();
$('#Options').val(arr.join("\n\n\n.\n"));
});
});
HTML
<script type="text/javascript" src="../dis/jquery.min.js"></script>
<script type="text/javascript" src="../dis/checkboxoptions.js"></script>
<SCRIPT LANGUAGE="JavaScript">
window.clipboardData.setData('text',
document.getElementById('Options').value
);
function ClipBoard1()
{
//create a new element, otherwise setting of range.text
//will change the form-fields values
var dummy=document.createElement('textarea');
//the range
Copied = dummy.createTextRange();
//set the text
Copied.text = ".\n" +
"\+\+\+\+\+ CHECKS \+\+\+\+\+" +
"\n.\n" +
document.getElementById('Options').value + "\n\n"
;
//expand the range to contain all contents
Copied.expand('textedit');
//Copy
Copied.execCommand("Copy");
}
</SCRIPT>
</HEAD>
<body class="body">
<P>
<FORM name="Checks">
<div class="title">++++ CHECKS ++++</div>
<div class="main">
<div class="divTable">
<div class="divTableBody">
<div class="divTableRow">
<div class="divTableCell"><input type="checkbox" name="activeOptions" value='--Option 1--'>Option 1</div>
<div class="divTableCell"><input type="checkbox" name="activeOptions" value='--Option 3--'>Option 3</div>
<div class="divTableCell"><input type="checkbox" name="activeOptions" value='--Option 5--'>Option 5</div>
</div>
<div class="divTableRow">
<div class="divTableCell"><input type="checkbox" name="activeOptions" value='--Option 2--'>Option 2</div>
<div class="divTableCell"><input type="checkbox" name="activeOptions" value='--Option 4--'>Option 4</div>
<div class="divTableCell"><input type="checkbox" name="activeOptions" value='--Option 6--'>Option 6</div>
</div>
</div>
</div>
<p>
<TEXTAREA NAME="Options" ID="Options" rows="15" cols="55"></TEXTAREA>
<p align=center>
<BUTTON onClick="ClipBoard1();" class="copyreset">Copy & Reset</BUTTON>
<INPUT class="reset" type=reset value=Reset>
<p>
</DIV>
</FORM>
</BODY>
</HTML>