хочу добиться такой функции
- когда текстовая область отправляется в базу данных, разрывы строк удаляются (например, \ n -> "bar2019").
- данные экспортируются из базы данных и показывают, тот же эффект, что и у div.output (например, "bar2019" -> || \ n).
1: когда str + = "bar2019":
str = str.replace (/ bar2019 / g, "
");
может быть заменен только последний "bar2019"
2: когда str + = "\ n":
str = str.replace (/ \ n / g, "
");
все "\ n" могут быть заменены
function filterData(e) {
str = this.value;
if (e.keyCode === 13) {
// error: bar2019 ?
// str += "bar2019";
// good: \n
str += "\n";
}
console.log(this.value);
// error: bar2019 ?
// str = str.replace(/bar2019/g, "<br>");
// good: \n
str = str.replace(/\n/g, "<br>");
dataOutput.innerHTML = str;
}
var dataInput = document.getElementById("dataInput"),
dataOutput = document.getElementById("dataOutput"),
str = "";
function filterData(e) {
str = this.value;
if (e.keyCode === 13) {
// error: bar2019 ?
// str += "bar2019";
// good: \n
str += "\n";
}
// console.log(this.value);
// error: bar2019 ?
// str = str.replace(/bar2019/g, "<br>");
// good: \n
str = str.replace(/\n/g, "<br>");
dataOutput.innerHTML = str;
}
dataInput.addEventListener("change", filterData, false);
dataInput.addEventListener("input", filterData, false);
dataInput.addEventListener("keypress", filterData, false);
dataInput.addEventListener("keyup", filterData, false);
dataInput.addEventListener("plate", filterData, false);
.data-filter {
width: 90%;
margin: 20px auto;
overflow: hidden;
}
.data-filter>textarea,
.data-filter>div {
width: 48%;
min-height: 300px;
padding: 10px;
border: 1px solid #aaa;
float: left;
}
.data-filter>div {
color: #f80;
}
<div class="data-filter">
<textarea name="dataInput" id="dataInput" placeholder="Data input"></textarea>
<div id="dataOutput"></div>
</div>