Why has my javascript disabled my text area?


#1

Hey guys, I’d love your help! I’m still fairly new to this, so bear with me.

I’m building a js wysiwyg text editor, with a button that helps the users add in-house relative links. I’ve come to the relative link button, and my code has made my text area non-editable.

Would anyone be able to help me suss this out? I’m not too sure why it’s has disabled the text area, but the functionality of the button is fine? Surely if anything, my button would be the thing to not work?

PHP

<html>
<head>
<meta charset="UTF-8"> 
<title>Content Editor</title>
<script src ="js.js"></script>
<script src="jquery-3.3.1.js"></script>
</head>

<body onLoad = "iframe()">
<h2 style= "font-family: calibri;">Content Editor</h2>
<form method = "post" action="submit.php">
<input type = "button" value = "B" onclick = "bold()">
<input type = "button" value = "I" onclick = "italic()">
<input type = "button" value = "U" onclick = "underline()">
<input type = "button" value = "H2" onclick = "formatBlock()">
<input type = "button" value = "H3" onclick = "formatBlock()">
<input type = "button" value = "Bullets" onclick = "InsertUnorderedList()">
<input type = "button" value = "Numbered List" onclick = "InsertOrderedList()">
<input type = "button" value = "Link" onclick = "createLink()">
<input type = "button" value = "Unlink" onclick = "unlink()">
<input type = "button" value = "BCML link" onclick = "cats(e)">
<button type ="button" onClick="viewSource()">View Source</button>
<br><br>
<textarea name = "textarea" id = "textarea" style = "display: none;"></textarea>
<iframe name = "editor" id = "editor" style = "width: 600; height: 400;"></iframe>

<br><br>

</form>

</body>


</html>

JS

function iframe () {
	editor.document.designMode = 'on' ;
}

function bold()
	{
		editor.document.execCommand("bold", false, null);
	}
	
function italic()
	{
		editor.document.execCommand("italic", false, null);
	}
	
function underline()
	{
		editor.document.execCommand("underline", false, null);
	}
	
function formatBlock()
	{
		editor.document.execCommand("formatBlock", false, "h2");
	}
	
function formatBlock()
	{
		editor.document.execCommand("formatBlock", false, "h3");
	}
	
function InsertUnorderedList()
	{
		editor.document.execCommand("InsertUnorderedList", false, null);
	}
	
function InsertOrderedList()
	{
		editor.document.execCommand("InsertOrderedList", false, null);
	}
	
function createLink()
    {
        var link = prompt("Enter the link", "https://");
        editor.document.execCommand('createLink', false, link);
	}
	
function unlink()
    {
        editor.document.execCommand('unlink', false, null);
	}
	
function(e) {
    e = b.editor;
    var a = c(b.popup).find("#logicalId"),
        f = c(b.popup).find("#pageKey")
    if ("" == a.val() && "" == f.val()) return alert("you must enter either logicalId or pageKey"), !1
    if ("" != a.val() && "" != f.val()) return alert("you cannot enter both logicalId and pageKey"), !1
    var d = "<a href='#' bcmltype='link' "
    "" != a.val() && (d += "logicalid='" + a.val() + "' ")
    "" != f.val() && (d += "pagekey='" + f.val() + "' ")
    a = c(b.popup).find("#cssClass")
    "" != a.val() && (d += "class='" + a.val() + "' ")
    a = c(b.popup).find("#htmlId")
    "" != a.val() && (d += "id='" + a.val() + "' ")
    c(b.popup).find("#target").is(":checked") && (d += "target='_blank' ")
    a = c(b.popup).find("#params")
    "" != a.val() && (d += "params='" + a.val() + "' ")
    a = c(b.popup).find("#frag")
    "" != a.val() && (d += "frag='" + a.val() + "' ")
    a = c(b.popup).find("#dataOln")
    "" != a.val() && (d += "data-oln='" + a.val() + "' ")
    d += ">"
    a = c(b.popup).find("#linkText")
    d = "" != a.val() ? d + a.val() : d + "[DEFAULT_TITLE]"
    (d += "</a>") && e.execCommand(b.command, d, null, b.button)
    c(b.popup).find(":text").val("")
    e.hidePopups()
    e.focus()
};

Any help would be much appreciated!


#2

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.