Can anyone suggest how this script can work without a button?

JavaScript
1

This script is perfect to auto-scroll some text being sent in via php as a means of scrolling down to the bottom so users can read the incoming data. However, this one makes use of a button. Can anyone tell me how to make the script ‘automatic’ as text is being submitted to the div rather then by the push of a button?


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" 
    "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<title>untitled</title>
<style type="text/css">

#text {
	width: 200px;
	height: 200px;
	overflow: scroll;
	padding-left: 3px;
	border: 1px #000 solid;
}

</style>
<script type="text/javascript">

onload = function()
{
	document.getElementById('text').addText = function()
	{
		s = '<br />scrollHeight: ' + this.scrollHeight;
		this.innerHTML += s;
		this.scrollTop = this.scrollHeight;
	}
}

</script>
</head>
<body>
<input type="button" value="add text" onclick="document.getElementById('text').addText()" />
<hr />
<div id="text">
<br /><br /><br /><br /><br /><br /><br /><br />
<script>
document.write('scrollHeight: ' + document.getElementById('text').scrollHeight);
</script>
</div>
</body>
</html>
2

Thread continues here:

THREAD CLOSED

3

The whole point of id is that there should only be ONE instance of an id. If you need multiple instances then use class instead. :slight_smile: (The related call is getElementsByClassName but I’m not sure if this is universally supported).

4

I’ve been searching and playing with this script for the past few hours and finally got it work!

<script type="text/javascript">
function fnSelect(objId)
{
   fnDeSelect();
   if (document.selection) 
   {
      var range = document.body.createTextRange();
      range.moveToElementText(document.getElementById(objId));
      range.select();
   }
   else if (window.getSelection) 
   {
      var range = document.createRange();
      range.selectNode(document.getElementById(objId));
      window.getSelection().addRange(range);
   }
}
function fnDeSelect() 
{
   if (document.selection)
             document.selection.empty();
   else if (window.getSelection)
              window.getSelection().removeAllRanges();
} 
</script>


<div id="mydiv">Hi, How are you?</div>
<input type="button" value="Copy Code" onClick="fnSelect('mydiv')">

But for the life of my I can’t figure out how to grab all instances of the same div. For example, the function will only grab “Hi,”


<div id="mydiv">Hi,</div>
<div id="div2"></div>
<div id="mydiv">how</div>
<div id="div2"></div>
<div id="mydiv">are</div>
<div id="div2"></div>
<div id="mydiv">you?</div>

however, what I need is a way to get all instances of the same div. Can someone please help me out with this if they have a second?

5

Try something like this:


	document.getElementById('text').addText = function()
	{
		s = '<br />scrollHeight: ' + this.scrollHeight;
		this.innerHTML += s;
		this.scrollTop = this.scrollHeight;
                setTimeout("document.getElementById('text').addText()",3000);
	}

 setTimeout("document.getElementById('text').addText()",3000);

Essentially you automate the button clicking. Change “3000” to suit the speed you need.