复选框文本到文本区域

时间:2018-08-12 20:29:58

标签: javascript html

我需要有很多可以通过复选框选择的句子,它们将立即显示在其下方的文本区域中。在textarea上可以更改句子,然后将textarea导出为docx和pdf。我是 dinheiro 用户从Sitepoint.com论坛获得的2007年这个漂亮的脚本。

每个句子都应单独行且句子之间应换行。添加句子后,一切都会顺利进行,但是删除句子时,句子之间会缺少换行符。我在

行上对原始脚本进行了一些更改

df[1][0].value+=this.name+'\n\n ';

原始文件为df[1][0].value+=this.name+' ';

并添加了一行df[1][0].value=df[1][0].value.replace(/\n/g, '');

任何人都可以帮助解决这个问题,或者有人有更好的解决方案来做到这一点?谢谢!

window.onload = function() {
  df = document.forms;
  inp = df[0].getElementsByTagName('input');
  for (c = 0; c < inp.length; c++) {
    if (inp[c].type == 'checkbox') {
      inp[c].onclick = function() {
        if (this.checked == true) {
          df[1][0].value += this.name + '\n\n ';
        } else {
          df[1][0].value = df[1][0].value.replace(/\n/g, '');
          df[1][0].value = df[1][0].value.replace(this.name + ' ', '');
        }
      }
    }
  }
}
<form action="#">
  <div>
    <input type="checkbox" name="- foo" />foo<br>
    <input type="checkbox" name="- blah" />blah<br>
    <input type="checkbox" name="- dodah" />dodah<br>
  </div>
</form>

<form action="#">
  <div>
    <textarea cols="20" rows="10"></textarea>
  </div>
</form>

将复选框文本添加到文本区域,编辑文本区域上的文本,添加一些额外的文本以及将其与其他字段一起发送到处理程序,该怎么办?

1 个答案:

答案 0 :(得分:1)

问题在于此行正在删除换行符,从而使文本显示在同一行中

df[1][0].value=df[1][0].value.replace(/\n/g, '');

因此,我仅提供与要删除的特定单词相关的换行符:

df[1][0].value=df[1][0].value.replace(this.name+'\n\n','');

这是工作代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
        "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    
    <script type="text/javascript">
    
    window.onload=function() {
        
        df=document.forms;
        inp=df[0].getElementsByTagName('input');
    for(c=0;c<inp.length;c++) {
    if(inp[c].type=='checkbox') {
        inp[c].onclick=function() {
        debugger;
    if(this.checked==true){
        df[1][0].value+=this.name+'\n\n';
    }
    else {
        df[1][0].value=df[1][0].value.replace(this.name+'\n\n','');
          }
         }
        }
       }
      }
    </script>
    
    </head>
    <body>
    
    <form action="#">
        <div>
            <input type="checkbox" name="- foo"/>foo<br>
            <input type="checkbox" name="- blah"/>blah<br>
            <input type="checkbox" name="- dodah"/>dodah<br>
        </div>
    </form>
    
    <form action="#">
        <div>
            <textarea cols="20" rows="10"></textarea>
        </div>
    </form>
    
    </body>
    </html>