Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

serginho_the_best

como faço para cada Enter cria um paragrafo

Recommended Posts

oi, eu não sei muito javascript então peguei esse script na net para usar, mais queria fazer para cada Enter cria uma <p></p> e já jogar oq vou digitar dentro, e quando dar Shieft+Ender cria um <br />, ta aqui o script:

 

// Cross-Browser Rich Text Editor// http://www.kevinroth.com/rte/demo.htm// Written by Kevin Roth (kevin@NOSPAMkevinroth.com - remove NOSPAM)//init variablesvar isRichText = false;var rng;var currentRTE;var allRTEs = "";var isIE;var isGecko;var imagesPath;var includesPath;var cssFile;function initRTE(imgPath, incPath, css) {	//check to see if designMode mode is available	if (document.getElementById && document.designMode) isRichText = true;		//set browser vars	var ua = navigator.userAgent.toLowerCase();	isIE = ((ua.indexOf("msie") != -1) && (ua.indexOf("opera") == -1) && (ua.indexOf("webtv") == -1)); 	isGecko = (ua.indexOf("gecko") != -1 && ua.indexOf("safari") == -1);		//set paths vars	imagesPath = imgPath;	includesPath = incPath;	cssFile = css;		//for testing standard textarea, uncomment the following line	//isRichText = false;}function writeRichText(rte, html, width, height, buttons, readOnly) {	if (isRichText) {		if (allRTEs.length > 0) allRTEs += ";";		allRTEs += rte;		writeRTE(rte, html, width, height, buttons, readOnly);	} else {		writeDefault(rte, html, width, height, buttons, readOnly);	}}function writeDefault(rte, html, width, height, buttons, readOnly) {	if (!readOnly) {		document.writeln('<textarea name="' + rte + '" id="' + rte + '" style="width: ' + width + 'px; height: ' + height + 'px;">' + html + '</textarea>');	} else {		document.writeln('<textarea name="' + rte + '" id="' + rte + '" style="width: ' + width + 'px; height: ' + height + 'px;" readonly>' + html + '</textarea>');	}}function writeRTE(rte, html, width, height, buttons, readOnly) {	if (readOnly) buttons = false;	if (buttons == true) {		document.writeln('<style type="text/css">');		document.writeln('.btnImage {cursor: pointer; cursor: hand;}');		document.writeln('</style>');		document.writeln('<table id="Buttons1_' + rte + '" style="margin:0">');//		document.writeln('	<tr>');//		document.writeln('		<td>');//		document.writeln('			<select id="formatblock_' + rte + '" onchange="Select(\'' + rte + '\', this.id);">');//		document.writeln('				<option value="<p>">Normal</option>');//		document.writeln('				<option value="<p>">Paragraph</option>');//		document.writeln('				<option value="<h1>">Heading 1 <h1></option>');//		document.writeln('				<option value="<h2>">Heading 2 <h2></option>');//		document.writeln('				<option value="<h3>">Heading 3 <h3></option>');//		document.writeln('				<option value="<h4>">Heading 4 <h4></option>');//		document.writeln('				<option value="<h5>">Heading 5 <h5></option>');//		document.writeln('				<option value="<h6>">Heading 6 <h6></option>');//		document.writeln('				<option value="<address>">Address <ADDR></option>');//		document.writeln('				<option value="<pre>">Formatted <pre></option>');//		document.writeln('			</select>');//		document.writeln('		</td>');//		document.writeln('		<td>');//		document.writeln('			<select id="fontname_' + rte + '" onchange="Select(\'' + rte + '\', this.id)">');//		document.writeln('				<option value="Font" selected>Font</option>');//		document.writeln('				<option value="Arial, Helvetica, sans-serif">Arial</option>');//		document.writeln('				<option value="Courier New, Courier, mono">Courier New</option>');//		document.writeln('				<option value="Times New Roman, Times, serif">Times New Roman</option>');//		document.writeln('				<option value="Verdana, Arial, Helvetica, sans-serif">Verdana</option>');//		document.writeln('			</select>');//		document.writeln('		</td>');//		document.writeln('		<td>');//		document.writeln('			<select unselectable="on" id="fontsize_' + rte + '" onchange="Select(\'' + rte + '\', this.id);">');//		document.writeln('				<option value="Size">Size</option>');//		document.writeln('				<option value="1">1</option>');//		document.writeln('				<option value="2">2</option>');//		document.writeln('				<option value="3">3</option>');//		document.writeln('				<option value="4">4</option>');//		document.writeln('				<option value="5">5</option>');//		document.writeln('				<option value="6">6</option>');//		document.writeln('				<option value="7">7</option>');//		document.writeln('			</select>');//		document.writeln('		</td>');//		document.writeln('	</tr>');		document.writeln('</table>');		document.writeln('<table id="Buttons2_' + rte + '" cellpadding="1" cellspacing="0" style="margin:0">');		document.writeln('	<tr>');		document.writeln('		<td><img class="btnImage" src="' + imagesPath + 'post_button_bold.gif" width="25" height="24" alt="Bold" title="Bold" onClick="FormatText(\'' + rte + '\', \'bold\', \'\')"></td>');		document.writeln('		<td><img class="btnImage" src="' + imagesPath + 'post_button_italic.gif" width="25" height="24" alt="Italic" title="Italic" onClick="FormatText(\'' + rte + '\', \'italic\', \'\')"></td>');		document.writeln('		<td><img class="btnImage" src="' + imagesPath + 'post_button_underline.gif" width="25" height="24" alt="Underline" title="Underline" onClick="FormatText(\'' + rte + '\', \'underline\', \'\')"></td>');		document.writeln('		<td> </td>');		document.writeln('		<td><img class="btnImage" src="' + imagesPath + 'post_button_left_just.gif" width="25" height="24" alt="Align Left" title="Align Left" onClick="FormatText(\'' + rte + '\', \'justifyleft\', \'\')"></td>');		document.writeln('		<td><img class="btnImage" src="' + imagesPath + 'post_button_centre.gif" width="25" height="24" alt="Center" title="Center" onClick="FormatText(\'' + rte + '\', \'justifycenter\', \'\')"></td>');		document.writeln('		<td><img class="btnImage" src="' + imagesPath + 'post_button_right_just.gif" width="25" height="24" alt="Align Right" title="Align Right" onClick="FormatText(\'' + rte + '\', \'justifyright\', \'\')"></td>');		document.writeln('		<td><img class="btnImage" src="' + imagesPath + 'post_button_justifyfull.gif" width="25" height="24" alt="Justify Full" title="Justify Full" onclick="FormatText(\'' + rte + '\', \'justifyfull\', \'\')"></td>');		document.writeln('		<td> </td>');		document.writeln('		<td><img class="btnImage" src="' + imagesPath + 'post_button_numbered_list.gif" width="25" height="24" alt="Ordered List" title="Ordered List" onClick="FormatText(\'' + rte + '\', \'insertorderedlist\', \'\')"></td>');		document.writeln('		<td><img class="btnImage" src="' + imagesPath + 'post_button_list.gif" width="25" height="24" alt="Unordered List" title="Unordered List" onClick="FormatText(\'' + rte + '\', \'insertunorderedlist\', \'\')"></td>');		document.writeln('		<td> </td>');//		document.writeln('		<td><img class="btnImage" src="' + imagesPath + 'post_button_outdent.gif" width="25" height="24" alt="Outdent" title="Outdent" onClick="FormatText(\'' + rte + '\', \'outdent\', \'\')"></td>');//		document.writeln('		<td><img class="btnImage" src="' + imagesPath + 'post_button_indent.gif" width="25" height="24" alt="Indent" title="Indent" onClick="FormatText(\'' + rte + '\', \'indent\', \'\')"></td>');		document.writeln('		<td><div id="forecolor_' + rte + '"><img class="btnImage" src="' + imagesPath + 'post_button_textcolor.gif" width="25" height="24" alt="Text Color" title="Text Color" onClick="FormatText(\'' + rte + '\', \'forecolor\', \'\')"></div></td>');		document.writeln('		<td><div id="hilitecolor_' + rte + '"><img class="btnImage" src="' + imagesPath + 'post_button_bgcolor.gif" width="25" height="24" alt="Background Color" title="Background Color" onClick="FormatText(\'' + rte + '\', \'hilitecolor\', \'\')"></div></td>');		document.writeln('		<td> </td>');		document.writeln('		<td><img class="btnImage" src="' + imagesPath + 'post_button_hyperlink.gif" width="25" height="24" alt="Insert Link" title="Insert Link" onClick="FormatText(\'' + rte + '\', \'createlink\')"></td>');		document.writeln('		<td><img class="btnImage" src="' + imagesPath + 'post_button_image.gif" width="25" height="24" alt="Add Image" title="Add Image" onClick="AddImage(\'' + rte + '\')"></td>');		if (isIE) document.writeln('		<td><img class="btnImage" src="' + imagesPath + 'post_button_spellcheck.gif" width="25" height="24" alt="Spell Check" title="Spell Check" onClick="checkspell()"></td>');//		document.writeln('		<td> </td>');//		document.writeln('		<td><img class="btnImage" src="' + imagesPath + 'post_button_cut.gif" width="25" height="24" alt="Cut" title="Cut" onClick="FormatText(\'' + rte + '\', \'cut\')"></td>');//		document.writeln('		<td><img class="btnImage" src="' + imagesPath + 'post_button_copy.gif" width="25" height="24" alt="Copy" title="Copy" onClick="FormatText(\'' + rte + '\', \'copy\')"></td>');//		document.writeln('		<td><img class="btnImage" src="' + imagesPath + 'post_button_paste.gif" width="25" height="24" alt="Paste" title="Paste" onClick="FormatText(\'' + rte + '\', \'paste\')"></td>');//		document.writeln('		<td> </td>');//		document.writeln('		<td><img class="btnImage" src="' + imagesPath + 'post_button_undo.gif" width="25" height="24" alt="Undo" title="Undo" onClick="FormatText(\'' + rte + '\', \'undo\')"></td>');//		document.writeln('		<td><img class="btnImage" src="' + imagesPath + 'post_button_redo.gif" width="25" height="24" alt="Redo" title="Redo" onClick="FormatText(\'' + rte + '\', \'redo\')"></td>');		document.writeln('	</tr>');		document.writeln('</table>');	}	document.writeln('<iframe id="' + rte + '" name="' + rte + '" width="' + width + 'px" height="' + height + 'px" style="margin-top:3px"></iframe>');	if (!readOnly) document.writeln('<br /><input type="checkbox" id="chkSrc' + rte + '" onclick="toggleHTMLSrc(\'' + rte + '\');" /> HTML');	document.writeln('<iframe width="254" height="174" id="cp' + rte + '" src="' + includesPath + 'palette.htm" marginwidth="0" marginheight="0" scrolling="no" style="visibility:hidden; display: none; position: absolute;"></iframe>');	document.writeln('<input type="hidden" id="hdn' + rte + '" name="' + rte + '" value="">');	document.getElementById('hdn' + rte).value = html;	enableDesignMode(rte, html, readOnly);}function enableDesignMode(rte, html, readOnly) {	var frameHtml = "<html id=\"" + rte + "\">\n";	frameHtml += "<head>\n";	//to reference your stylesheet, set href property below to your stylesheet path and uncomment	if (cssFile.length > 0) {		frameHtml += "<link media=\"all\" type=\"text/css\" href=\"" + cssFile + "\" rel=\"stylesheet\">\n";	}	frameHtml += "<style>\n";	frameHtml += "body {\n";	frameHtml += "	background: #FFFFFF;\n";	frameHtml += "	margin: 0px;\n";	frameHtml += "	padding: 0px;\n";	frameHtml += "}\n";	frameHtml += "</style>\n";	frameHtml += "</head>\n";	frameHtml += "<body>\n";	frameHtml += html + "\n";	frameHtml += "</body>\n";	frameHtml += "</html>";		if (document.all) {		var oRTE = frames[rte].document;		oRTE.open();		oRTE.write(frameHtml);		oRTE.close();		if (!readOnly) oRTE.designMode = "On";	} else {		try {			if (!readOnly) document.getElementById(rte).contentDocument.designMode = "on";			try {				var oRTE = document.getElementById(rte).contentWindow.document;				oRTE.open();				oRTE.write(frameHtml);				oRTE.close();				//oRTE.addEventListener("blur", updateRTE(rte), true);				if (isGecko && !readOnly) {					//attach a keyboard handler for gecko browsers to make keyboard shortcuts work					oRTE.addEventListener("keypress", kb_handler, true);				}			} catch (e) {				alert("Error preloading content.");			}		} catch (e) {			//gecko may take some time to enable design mode.			//Keep looping until able to set.			if (isGecko) {				setTimeout("enableDesignMode('" + rte + "', '" + html + "');", 10);			} else {				return false;			}		}	}}function updateRTEs() {	var vRTEs = allRTEs.split(";");	for (var i = 0; i < vRTEs.length; i++) {		updateRTE(vRTEs[i]);	}}function updateRTE(rte) {	//set message value	var oHdnMessage = document.getElementById('hdn' + rte);	var oRTE = document.getElementById(rte);	var readOnly = false;		//check for readOnly mode	if (document.all) {		if (frames[rte].document.designMode != "On") readOnly = true;	} else {		if (document.getElementById(rte).contentDocument.designMode != "on") readOnly = true;	}		if (isRichText && !readOnly) {		//if viewing source, switch back to design view		if (document.getElementById("chkSrc" + rte).checked) {			document.getElementById("chkSrc" + rte).checked = false;			toggleHTMLSrc(rte);		}				if (oHdnMessage.value == null) oHdnMessage.value = "";		if (document.all) {			oHdnMessage.value = frames[rte].document.body.innerHTML;		} else {			oHdnMessage.value = oRTE.contentWindow.document.body.innerHTML;		}		//if there is no content (other than formatting) set value to nothing		if (stripHTML(oHdnMessage.value.replace(" ", " ")) == "") oHdnMessage.value = "";	}}function toggleHTMLSrc(rte) {	//contributed by Bob Hutzel (thanks Bob!)	var oRTE;	if (document.all) {		oRTE = frames[rte].document;	} else {		oRTE = document.getElementById(rte).contentWindow.document;	}		if (document.getElementById("chkSrc" + rte).checked) {		document.getElementById("Buttons1_" + rte).style.visibility = "hidden";		document.getElementById("Buttons2_" + rte).style.visibility = "hidden";		if (document.all) {			oRTE.body.innerText = oRTE.body.innerHTML;		} else {			var htmlSrc = oRTE.createTextNode(oRTE.body.innerHTML);			oRTE.body.innerHTML = "";			oRTE.body.appendChild(htmlSrc);		}	} else {		document.getElementById("Buttons1_" + rte).style.visibility = "visible";		document.getElementById("Buttons2_" + rte).style.visibility = "visible";		if (document.all) {			oRTE.body.innerHTML = oRTE.body.innerText;		} else {			var htmlSrc = oRTE.body.ownerDocument.createRange();			htmlSrc.selectNodeContents(oRTE.body);			oRTE.body.innerHTML = htmlSrc.toString();		}	}}//Function to format text in the text boxfunction FormatText(rte, command, option) {	var oRTE;	if (document.all) {		oRTE = frames[rte];				//get current selected range		var selection = oRTE.document.selection; 		if (selection != null) {			rng = selection.createRange();		}	} else {		oRTE = document.getElementById(rte).contentWindow;				//get currently selected range		var selection = oRTE.getSelection();		rng = selection.getRangeAt(selection.rangeCount - 1).cloneRange();	}		try {		if ((command == "forecolor") || (command == "hilitecolor")) {			//save current values			parent.command = command;			currentRTE = rte;						//position and show color palette			buttonElement = document.getElementById(command + '_' + rte);			document.getElementById('cp' + rte).style.left = getOffsetLeft(buttonElement) + "px";			document.getElementById('cp' + rte).style.top = (getOffsetTop(buttonElement) + buttonElement.offsetHeight) + "px";			if (document.getElementById('cp' + rte).style.visibility == "hidden") {				document.getElementById('cp' + rte).style.visibility = "visible";				document.getElementById('cp' + rte).style.display = "inline";			} else {				document.getElementById('cp' + rte).style.visibility = "hidden";				document.getElementById('cp' + rte).style.display = "none";			}		} else if (command == "createlink") {			var szURL = prompt("Digite a URL do site:", "http://");			try {				//ignore error for blank urls				oRTE.document.execCommand("Unlink", false, null);				oRTE.document.execCommand("CreateLink", false, szURL);			} catch (e) {				//do nothing			}		} else {			//oRTE.focus();			  oRTE.document.execCommand(command, false, option);			//oRTE.focus();		}	} catch (e) {		alert(e);	}}//Function to set colorfunction setColor(color) {	var rte = currentRTE;	var oRTE;	if (document.all) {		oRTE = frames[rte];	} else {		oRTE = document.getElementById(rte).contentWindow;	}		var parentCommand = parent.command;	if (document.all) {		//retrieve selected range		var sel = oRTE.document.selection; 		if (parentCommand == "hilitecolor") parentCommand = "backcolor";		if (sel != null) {			var newRng = sel.createRange();			newRng = rng;			newRng.select();		}	} else {		//oRTE.focus();	}	oRTE.document.execCommand(parentCommand, false, color);	//oRTE.focus();	document.getElementById('cp' + rte).style.visibility = "hidden";	document.getElementById('cp' + rte).style.display = "none";}//Function to add imagefunction AddImage(rte) {	var oRTE;	if (document.all) {		oRTE = frames[rte];				//get current selected range		var selection = oRTE.document.selection; 		if (selection != null) {			rng = selection.createRange();		}	} else {		oRTE = document.getElementById(rte).contentWindow;				//get currently selected range		var selection = oRTE.getSelection();		rng = selection.getRangeAt(selection.rangeCount - 1).cloneRange();	}		imagePath = prompt('Digite a URL da imagem:', 'http://');					if ((imagePath != null) && (imagePath != "")) {		//oRTE.focus();		oRTE.document.execCommand('InsertImage', false, imagePath);	}	//oRTE.focus();}//function to perform spell checkfunction checkspell() {	try {		var tmpis = new ActiveXObject("ieSpell.ieSpellExtension");		tmpis.CheckAllLinkedDocuments(document);	}	catch(exception) {		if(exception.number==-2146827859) {			if (confirm("ieSpell not detected.  Click Ok to go to download page."))				window.open("http://www.iespell.com/download.php","DownLoad");		} else {			alert("Error Loading ieSpell: Exception " + exception.number);		}	}}function getOffsetTop(elm) {	var mOffsetTop = elm.offsetTop;	var mOffsetParent = elm.offsetParent;		while(mOffsetParent){		mOffsetTop += mOffsetParent.offsetTop;		mOffsetParent = mOffsetParent.offsetParent;	}		return mOffsetTop;}function getOffsetLeft(elm) {	var mOffsetLeft = elm.offsetLeft;	var mOffsetParent = elm.offsetParent;		while(mOffsetParent) {		mOffsetLeft += mOffsetParent.offsetLeft;		mOffsetParent = mOffsetParent.offsetParent;	}		return mOffsetLeft;}function Select(rte, selectname) {	var oRTE;	if (document.all) {		oRTE = frames[rte];				//get current selected range		var selection = oRTE.document.selection; 		if (selection != null) {			rng = selection.createRange();		}	} else {		oRTE = document.getElementById(rte).contentWindow;				//get currently selected range		var selection = oRTE.getSelection();		rng = selection.getRangeAt(selection.rangeCount - 1).cloneRange();	}		var idx = document.getElementById(selectname).selectedIndex;	// First one is always a label	if (idx != 0) {		var selected = document.getElementById(selectname).options[idx].value;		var cmd = selectname.replace('_' + rte, '');		oRTE.document.execCommand(cmd, false, selected);		document.getElementById(selectname).selectedIndex = 0;	}	//oRTE.focus();}function kb_handler(evt) {	var rte = evt.target.id;		//contributed by Anti Veeranna (thanks Anti!)	if (evt.ctrlKey) {		var key = String.fromCharCode(evt.charCode).toLowerCase();		var cmd = '';		switch (key) {			case 'b': cmd = "bold"; break;			case 'i': cmd = "italic"; break;			case 'u': cmd = "underline"; break;		};		if (cmd) {			FormatText(rte, cmd, true);			//evt.target.ownerDocument.execCommand(cmd, false, true);			// stop the event bubble			evt.preventDefault();			evt.stopPropagation();		} 	}}function docChanged (evt) {	alert('changed');}function stripHTML(oldString) {	var newString = oldString.replace(/(<([^>]+)>)/ig,"");		//replace carriage returns and line feeds	newString = escape(newString);	newString = newString.replace("%0D%0A"," ");	newString = newString.replace("%0A"," ");	newString = newString.replace("%0D"," ");	newString = unescape(newString);		//trim string	newString = trim(newString);		return newString;}function trim(inputString) {   // Removes leading and trailing spaces from the passed string. Also removes   // consecutive spaces and replaces it with one space. If something besides   // a string is passed in (null, custom object, etc.) then return the input.   if (typeof inputString != "string") return inputString;   var retValue = inputString;   var ch = retValue.substring(0, 1);	   while (ch == " ") { // Check for spaces at the beginning of the string	  retValue = retValue.substring(1, retValue.length);	  ch = retValue.substring(0, 1);   }   ch = retValue.substring(retValue.length-1, retValue.length);	   while (ch == " ") { // Check for spaces at the end of the string	  retValue = retValue.substring(0, retValue.length-1);	  ch = retValue.substring(retValue.length-1, retValue.length);   }		// Note that there are two spaces in the string - look for multiple spaces within the string   while (retValue.indexOf("  ") != -1) {		// Again, there are two spaces in each of the strings	  retValue = retValue.substring(0, retValue.indexOf("  ")) + retValue.substring(retValue.indexOf("  ")+1, retValue.length);   }   return retValue; // Return the trimmed string back to the user}

obrigado :)

Compartilhar este post


Link para o post
Compartilhar em outros sites

no final da sua função enableDesignMode, adicione:

if (isIE) 	{ 		var hack = function () {rteKeyPress(document.getElementById(rte).contentWindow);}; 		var oRTE = document.getElementById(rte).contentWindow; 		oRTE.document.onkeypress = hack; 	}

abaixo da função, crie uma nova:

function rteKeyPress(window) { 	if (window.event.keyCode == 13) { 		var range = window.document.selection.createRange();				window.event.returnValue = false; // cancel Standard-event 		range.pasteHTML('<p>'); 		range.select(); // re-sets the cursor to the right positsion 	} }

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.