input ile div e yazı yazdırırken alt satıra geçtiğimi algılamıyor
İnputa yazdığım
dive yazdırdığı
Ben ise yine alt alta yazdırmasını istiyorum.
Soru hatalı mı? 👎
Eğer sorunun kurallara aykırı olduğunu düşünüyorsanız lütfen bize bildirin!
Cevaplar (4)
ister eklerken ve düzenlerken kullan
let myObj = {
title: addTitle.value,
text: addTxt.value.replace("\n", "<br>")
}
istersende gösterirken
`
<h3 class="note-title"> ${element.title} </h3>
<p class="note-text"> ${element.text.replace("\n", "<br>")}</p>
`
@makifgokce burdaki kodlara nasıl entegre edebilirim :(
$(function(){
$('#notesBaslik #addNote').click(function(){
$('#notes-main').fadeIn(200)
});
$('#notes-main #container1 form #close-btn').click(function(event){
zortEngelle(event);
$('#notes-main').fadeOut(200)
})
});
function zortEngelle(event) {
event = event || window.event;
event.preventDefault();
return (false);
}
function ekleVeKapat() {
$('#notes-main').fadeOut(200)
}
function noteEdit() {
$('#notes-main').fadeIn(200)
}
let addBtn = document.getElementById("add-btn");
addBtn.addEventListener("click", function(e, event) {
zortEngelle(event);
let addTitle = document.getElementById("note-title");
let addTxt = document.getElementById("note-text");
if (addTitle.value == "" || addTxt.value == "") {
return alert("Please add Note Title and Details")
}
let notes = localStorage.getItem("notes");
if (notes == null) {
notesObj = [];
} else {
notesObj = JSON.parse(notes);
}
let myObj = {
title: addTitle.value,
text: addTxt.value
}
notesObj.push(myObj);
localStorage.setItem("notes", JSON.stringify(notesObj));
addTxt.value = "";
addTitle.value = "";
ekleVeKapat();
showNotes();
});
function showNotes() {
let notes = localStorage.getItem("notes");
if (notes == null) {
notesObj = [];
} else {
notesObj = JSON.parse(notes);
}
let html = "";
notesObj.forEach(function(element, index) {
html += `
<div class="note">
<h3 class="note-title"> ${element.title} </h3>
<p class="note-text"> ${element.text}</p>
<button id="${index}"onclick="deleteNote(this.id)" class="note-btn"><i class="fas fa-times-circle"></i></button>
<button id="${index}"onclick="editNote(this.id)" class="note-btn edit-btn"><i class="fas fa-edit"></i></button>
</div>
`;
});
let notesElm = document.getElementById("notes");
if (notesObj.length != 0) {
notesElm.innerHTML = html;
} else {
notesElm.innerHTML = `No notes yet! You can add notes using the add note button above.`;
}
}
function deleteNote(index) {
let notes = localStorage.getItem("notes");
if (notes == null) {
notesObj = [];
} else {
notesObj = JSON.parse(notes);
}
notesObj.splice(index, 1);
localStorage.setItem("notes", JSON.stringify(notesObj));
showNotes();
}
function editNote(index) {
let notes = localStorage.getItem("notes");
let addTitle = document.getElementById("note-title");
let addTxt = document.getElementById("note-text");
if (addTitle.value !== "" || addTxt.value !== "") {
return alert("Please clear the form before editing a note")
}
if (notes == null) {
notesObj = [];
} else {
notesObj = JSON.parse(notes);
}
//console.log(notesObj);
notesObj.findIndex((element, index) => {
addTitle.value = element.title;
addTxt.value = element.text;
})
notesObj.splice(index, 1);
localStorage.setItem("notes", JSON.stringify(notesObj));
noteEdit();
showNotes();
}
showNotes();
<textarea id="txt"></textarea>
<div id="out"></div>
let txt = document.getElementById("txt")
let out = document.getElementById("out")
txt.addEventListener("keyup", function() {
out.innerHTML = txt.value.replace("\n", "<br>")
})