将textarea副本更改为textvalue,以减少空间

时间:2019-03-20 18:31:24

标签: javascript arrays text copy-paste

我对Java没有丝毫的了解,下面的脚本是我从多个来源整理而来的。该脚本可以满足我的需要,但是它占用了所有文本区域的太多空间-因为在我看来,它并不是真正需要的。我正在寻找复制到剪贴板的副本,其中的代码中包含文本值,并且在页面中不可见。最终只是试图摆脱textarea元素,并将其作为textvalue。

感谢您的帮助,谢谢

<html>
<title></title>
<head>
</head>

    <script>
    window.onload = function () {

  var copyTextareaBtn = Array.prototype.slice.call(document.querySelectorAll('.js-textareacopybtn'));
  var copyTextarea = Array.prototype.slice.call(document.querySelectorAll('.js-copytextarea'));

  copyTextareaBtn.forEach(function(btn, idx){
  
    btn.addEventListener("click", function(){
    
      copyTextarea[idx].select();

      try {
        var msg = document.execCommand('copy') ? 'successful' : 'unsuccessful';
        console.log('Copying text command was ' + msg);
      } catch (err) {
        console.log('Whoops, unable to copy');
      } 
      
    });
    
  });
}
    </script>

<style>
body {
  font-family: Times New Roman;
  color: white;
}

.split {
  height: 99.9%;
  width: 49.9%;
  position: fixed;
  z-index: 1;
  top: 2px;
  overflow-x: hidden;
  padding-top: 5px;
}

.left {
  left: 0;
  background-color: #111;
}

.right {
  right: 0;
  background-color: #111;
}

.centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}

.centered img {
  width: 150px;
  border-radius: 50%;
}
</style>

<body>

<div class="split left">
  <div class="Left">
   
		<h3><center></center></h3>

		<div>

       		<textarea class="js-copytextarea" readonly="readonly" style="width:10%;" rows="1"></textarea>
        	<button class="js-textareacopybtn"></button>
		</div>
		<div>

		
 		
		<h3><center></center></h3>

		<div>

		<textarea class="js-copytextarea" readonly="readonly" style="width:10%;" rows="1"></textarea>
        	<button class="js-textareacopybtn"></font></button>

		</div>
		
  </div>
</div>



<div class="split right">
  <div class="left">
	
		<h3><center></center></h3>

		<div>

        	<textarea class="js-copytextarea" readonly="readonly" style="width:10%;" rows="1"></textarea>
        	<button class="js-textareacopybtn"></button>

		</div>
		
 		<div>

		<h3><center></center></h3>

		<div>
		<textarea class="js-copytextarea" readonly="readonly" style="width:10%;" rows="1"></textarea>
        	<button class="js-textareacopybtn"></button>
		</div>
		
	</div>

 </div>
</div>

</div>

</body>
		<div>
		<footer>
		<h1></h1>
		</footer></div>
</html>

0 个答案:

没有答案