PDA

View Full Version : Problem outputting quote character



Dan K
Mar 21st, 2003, 12:14 AM
Hi, I was attempting to make some code for an AI chat room (Alice bot) and wanted responses to be displayed after a delay of 5 or so seconds. This is basically for realism to make people think the delay is for an actual person responding to input on the chat.

I have included the code below but it messes up when the output includes double quotes (i've highlighted the problem). The output (!OUTPUT!) is the response by the AI bot and sometimes includes double quotes which breaks the javascript code.

How do I get around the problem so double quotes can be returned without breaking the code?



<html>
<head>
<title>Chat Room</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body bgcolor="#FFFFFF" text="#000000" onLoad="setTimeout('chat()',5000)">
Welcome to my Chat Room<br>
<form method="POST">
Say:
<input type="TEXT" name="input">
</form>
<br>
<script type="text/javascript">
<!-- begin script

function chat() {

document.write(" !OUTPUT! ");

}

// end script -->
</script>
</body></html>

cheesebagpipe
Mar 21st, 2003, 12:20 AM
Never call document.write() from an event handler (except on another document).

Dan K
Mar 21st, 2003, 12:27 AM
can you tell what that means? my knowledge of javascript isn't too good.

also is there an alternative to displaying text without using document.write?

cheesebagpipe
Mar 21st, 2003, 12:55 AM
The document object held in the window.document property represents the web page itself (i.e., the currently loaded document). Call its .write() method, and you basically discard the old one and start a new one. It's not like a PHP echo (or ASP Response.write) where you're assembling a document-in-progress prior to downloading it; this dude has been fully loaded, the document 'stream' closed, and must be written to selectively. IE in particular (stop me if you've heard this before) handles these writes peculiarly; some scripters, heartened by their 'success' with it, drive themselves crazy trying to get consistent results with this approach. Don't waste your time.


<html>
<head>
<title>Chat Room</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
#output {
font: 400 20px "arial black";
}
</style>
<script type="text/javascript">

function chat() {
var el = document.getElementById('output');
if (el) el.innerHTML = '&amp;#147;yadda-yadda-yadda....&amp;#148;';
}

</script>
</head>
<body bgcolor="#FFFFFF" text="#000000" onLoad="setTimeout('chat()',5000)">
Welcome to my Chat Room<br>
<form method="POST">
Say:
<input type="TEXT" name="input">
</form>
<br>
<div id="output"></div>
</body>
</html>

Pure DOM approaches (no innerHTML) are also possible.

Dan K
Mar 21st, 2003, 03:52 AM
Thanks for that :thumbsup:

In the end I emulated the chat by making a layer containing the AI response visible after 5 seconds.

<html>
<head>
<title>Chat Room</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript1.2">
<!--
if (parseInt(navigator.appVersion) > 3) {
if (navigator.appName == "Netscape") {
layerVar="document.layers";
styleVar="";
}else{
layerVar="document.all";
styleVar=".style";
}
}

function skf_ShowHideLayer(TheLayer,TheAttrib) {
if (parseInt(navigator.appVersion) > 3) {
eval(layerVar + '["' + TheLayer + '"]' + styleVar + '.visibility = "' + TheAttrib + '"');
}
}
//-->
</script>
<script language="JavaScript">
<!--
function MM_reloadPage(init) { //reloads the window if Nav4 resized
if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
// -->
</script>
</head>

<body bgcolor="#FFFFFF" text="#000000" onLoad="setTimeout('chat()',5000)">
<div id="Layer1" style="position:absolute; left:10px; top:100px; width:300px; height:200px; z-index:1; visibility: hidden"><b><font color="#FFFF00">Dan
says:</font></b><font color="#FFFFFF"> !OUTPUT!</font></div>
<p>Chat Room </p>
<form method="POST">
<b>Say:</b>
<input type="TEXT" name="input">
</form>
<br>
<script type="text/javascript">
<!-- begin script

function chat() {
skf_ShowHideLayer('Layer1','visible');

}
// end script -->
</script>
</body></html>