Ich versuche, es so zu machen, dass, wenn ein Benutzer eine Taste nach der Eingabe von Text innerhalb eines editierbaren Inhaltsbereichs drückt es in ein anderes Div basierend auf was der Benutzer einfügen im zufriedenen Feld eingegeben. Die Funktion fügt basierend auf jeder einzelnen Zeile die Benutzereingaben ein.Wie man Text von einem Contenteditable Div zu einem anderen Div mit jQuery
Unten ist der Code zur Verfügung gestellt und ein Bild von einem Beispiel dafür, wie ich das Ergebnis wollen. Momentan, wenn die Taste gedrückt wird, gibt es eine Ausgabe von [Objekt Objekt]. Jede Hilfe wäre großartig. Vielen Dank!
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<meta charset="UTF-8">
<title> VERO Filter Program</title>
</head>
<body>
<div id="pbf-container">
<div class="pbf-header">
<h1> VERO Filter Program </h1>
<h3> Input Links Here </h3>
</div>
<div class="pbf-link-container" contenteditable="true">
</div>
<div class="pbf-button-control">
<button id="pbf-filter"> Filter </button>
</div>
<div class="pbf-link-output">
</div>
</div>
<script>
var $pbfOutput = $('.pbf-link-container[contenteditable]');
$('#pbf-filter').click(function(){
$('.pbf-link-output').text($pbfOutput);
});
</script>
</body>
</html>
Hier ist die CSS
/* DIV class and ID's */
#pbf-container {
display: block;
width: 1080px;
margin: 0 auto;
background-color: #333;
padding: 3%;
}
.pbf-header {
text-align: center;
}
.pbf-link-container {
width: 1080px;
min-height: 300px;
background-color: #f8f8f8;
font-size: 20px;
font-family: 'Lato', sans-serif;
}
.pbf-button-control {
text-align: center;
padding: 2%;
}
.pbf-link-output {
font-family: 'Lato', sans-serif;
font-size: 20px;
color: #fff;
}
'var $ pbfOutput = $ ('PBF-Link-Container [contenteditable].') Text (.),' –
Wollen Sie die Ausgabe als Text, der den Code darstellt? Oder möchten Sie echte DOM-Objekte? – zer00ne