色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

在我的HTML/CSS/JavaScript項目中，在兩個文本區域之間復制文本時保持粗體、彩色和斜體

CSS
錢淋西2年前8瀏覽0評論

我有一個代碼，我刪除了多余的空格，并做了一些修改...我有兩個文本區域，在第一個區域中，我放置了沒有格式化的文本，另一個區域是已經格式化的文本將要到達的地方。我在保留文本編輯設置(如粗體、彩色、斜體等)時遇到問題。).例如，如果我把一個已經用粗體、彩色和斜體顯示的文本放在區域1中，我希望它修改文本，保持這些設置。下面是代碼:

var resultado = [];

function Remover() {
  debugger
  var text1 = document.getElementById("areaText1");
  var text2 = document.getElementById("areaText2");
  var palavras = [];

  var textoFormatado = text1.textContent.replace(/\s+/g, ' ').trim();
  text2.innerHTML = textoFormatado;
  lerTexto(text1.textContent);
  // palavras = text1.textContent.split(/\s+/g);

  // text2.textContent = palavras.join(' ');
}

function Aplicar() {
  var editor = document.getElementById("areaText2");
  var colorPicker = document.getElementById("cor");

  if (document.queryCommandSupported('styleWithCSS')) {
    document.execCommand('styleWithCSS', false, true);
  }

  document.execCommand('foreColor', false, colorPicker.value);
}

function Formatar(command) {
  document.execCommand(command, false, null);
}

function lerTexto(texto) {
  debugger
  var linhas = texto.split('\n');
  var textoFormatado = '';

  for (var i = 0; i < linhas.length; i++) {
    var linha = linhas[i];
    var novaLinha = '';

    for (var j = 0; j < linha.length; j++) {
      var letra = linha[j];

      if (letra == ';') {
        novaLinha += letra + "<br><br>";
      } else if (letra == '.') {
        novaLinha += letra + "<br><br>";
      } else {
        novaLinha += letra;
      }
    }

    textoFormatado += novaLinha + '\n';

  }
  var textArea2 = document.getElementById("areaText2");
  console.log(texto);
  console.log(textoFormatado);
  textArea2.innerHTML = textoFormatado;

}

* {
  padding: 0;
  margin: 0;
  user-select: none;
}

body {
  background-color: lightblue;
}

h1 {
  font-family: 'Asap';
  font-size: 3em;
  text-align: center;
  padding: 20px;
  margin: 20px 0;
  background-color: rgb(130, 203, 227);
}

#fundo {
  min-height: 300px;
  height: auto;
  width: 1100px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  font-family: 'Dosis';
  font-weight: bold;
  font-size: 1.1em;
  border-radius: 10px;
  margin-bottom: 20px;
  padding: 15px;
  border: 5px solid rgb(96, 183, 212);
  background-color: rgb(148, 212, 234);
}

label {
  display: inline-block;
  font-size: 1.2em;
  font-weight: bolder;
}

section {
  display: inline-block;
  position: relative;
  padding: 2px;
  height: auto;
  width: 500px;
  padding-bottom: 30px;
}

.areaText {
  display: block;
  min-width: 460px;
  max-width: 500px;
  float: left;
  overflow-x: scroll;
  position: relative;
  top: 50%;
  font-family: Calibri, Helvetica, sans-serif;
  font-weight: 500;
  font-size: .8em;
  background-color: white;
  border-radius: 2px;
  min-height: 200px;
  height: auto;
  border: none;
  outline: none;
  user-select: all;
  margin: 5px;
  padding: 5px;
}

#btnFormatar {
  background-color: #2a90b0;
  border: none;
  padding: 5px;
  font-size: 1em;
  color: white;
  /* margin-left: 5px; */
  position: relative;
  left: 77%;
  border-radius: 3px;
  /* transform: translateX(-42%); */
}

section>#spanEdit {
  position: absolute;
  top: 100%;
  left: 58.5%;
  transform: translateY(-100%);
  display: block;
}

#spanColor {
  position: absolute;
  top: 100%;
  transform: translateY(-100%);
  display: block;
}

.btnsEdit {
  border: none;
  margin: 5px;
  padding: 5px;
  border-radius: 3px;
  background-color: #2a90b0;
  color: white;
}

.btnsEdit:hover,
#btnFormatar:hover {
  box-shadow: 1px -1px 0px #186378ce;
  background-color: #3b9bb8;
  transform: translate(-1px, 1px);
}

<body>
  <h1>Remove espa?os</h1>
  <div id="fundo">
    <section>
      <label for="areaText1">Texto</label><br>
      <div placeholder="Coloque o texto que deseja formatar aqui" id="areaText1" class="areaText" cols="60" rows="10" spellcheck="false" contenteditable="true" style="resize: none;"></div>
      <input type="button" onclick="Remover()" id="btnFormatar" value="Formatar">
    </section>
    <section style="float: right;">
      <label for="areaText2">Formatado</label><br>
      <div placeholder="Texto formatado" id="areaText2" class="areaText" cols="60" rows="10" spellcheck="false" contenteditable="true" style="resize: none;"></div>
      <span id="spanEdit">
                <!-- italico -->
                <input type="button" class="btnsEdit" value="Itálico" onclick="Formatar('italic')">
                <!-- negrito -->
                <input type="button" class="btnsEdit" value="Negrito" onclick="Formatar('bold')">
                <!-- underline -->
                <input type="button" class="btnsEdit" value="Linha" onclick="Formatar('underline')">
                <!-- cor -->
            </span>
      <span id="spanColor">
                <input type="color" class="btnsEdit" id="cor">
                <input type="button" class="btnsEdit" value="Aplicar" onclick="Aplicar()">
            </span>
    </section>
  </div>
</body>

</html>
<script src="script.js"></script>
<!-- Lorem, ipsum dolor sit amet consectetur adipisicing elit. Commodi nobis ipsa magnam nulla quidem? Temporibus, nulla. Mollitia natus, sit aperiam aspernatur sunt iure. Numquam quaerat quasi mollitia iure sapiente commodi.
Lorem ipsum dolor sit amet consectetur adipisicing elit. A dolores mollitia cum fugiat id eius, dicta recusandae iusto. Error, hic aspernatur. Velit, cum dicta. Numquam vitae hic impedit modi perspiciatis. -->