I need help for some javascript code. I need to make it so that every 7 seconds, "i" will increase by 1. So that I will get " 'i' people have died from hunger since you entered this web page." Eg.
Start: 0 people have died from hunger since you entered this web page
After 7 seconds: 1 people have died from hunger since you entered this web page.
After another 7 seconds: 2 people have died from hunger since you entered this web page.
Please help!. This is what I have been doing so far. I don't really know what I am doing actually. It would be good if a If statement could be added such that for the case of i=1, "people have" will be changed to "person has" - <html>
-
<body>
-
-
<script type="text/javascript">
-
i=0
-
setInterval ("i++", 7000 );
-
-
document.write(i);
-
-
function updateNumb(){
-
$('#numb').load();
-
}
-
setInterval( "updateNumb()", 7000 );
-
</script>
-
<p id="#numb">i</p>
-
-
</body>
-
</html>
Thanks in advance!
17  1577 
ok, document.write() must not be used.
you have one setInterval() too many (you only need one process to repeat)
you didn’t include jQuery/prototype (whatever framework you try to use).
an id must not start with a hash (#), that’s a "reserved keyword" in HTML.
Ok...Lets change it a bit - <html>
-
<body>
-
-
<script type="text/javascript">
-
i=0
-
setInterval ("i++", 7000 );
-
-
</script>
-
<p id="numb">i</p>
-
-
</body>
-
</html>
So I have to change the "i" at #numb so that it is a variable and then I have to make it change every 7 seconds.
well, wrong setInterval() deleted, however, the logic is correcter this time. what you need to do as next step is getting the <p> to update (try that first without setInterval())
personal stickie: - $(#numb).update = function () {
-
setTimeout(this.update.bind(this))
-
}
vs. - setInterval(update.bind($(#numb)))
- <html>
-
<body>
-
<p id="numb"></p>
-
-
<script type="text/javascript">
-
var i = 0;
-
setInterval (function(){
-
document.getElementById('numb').innerHTML = i;
-
i++;
-
}, 7000);
-
</script>
-
</body>
-
</html>
@agbb0cg: out of interest, can you code that also without using globals?
@Dormilich
maybe something like this?: - <html>
-
<body>
-
<p id="numb">0</p>
-
-
<script type="text/javascript">
-
setInterval (function(){
-
var numObj = document.getElementById('numb')
-
numObj.innerHTML = parseFloat(numObj.innerHTML) + 1;
-
}, 7000);
-
</script>
-
</body>
-
</html>
-
or you could have
<p id="numb"></p>
and
numObj.innerHTML = !numObj.innerHTML ? 0 : parseFloat(numObj.innerHTML) + 1;
but in this case, you would have a blank space the first 7 secs
I came up with this - (function () {
-
var numb = document.getElementById("numb");
-
function update() {
-
this.innerHTML = parseFloat(this.innerHTML) + 1;
-
}
-
setInterval(update.bind(numb), 7000);
-
})();
@agbb0cg Thanks a lot. Yours worked! But I still have to add " people have died of hunger since you entered this webpage." after the "0/1/2 etc." Eg. 3 people have died of hunger since you entered this webpage. I need to make it such that there are no breaks. If possible, please try to add a If statement such that if it is 1, then it will say "person has" instead of "people have", but it is not that necessary.
@Dormilich I don't understand your last reply. Please explain how it can be used. Thanks a lot.
@bbkc22113 - <html>
-
<body>
-
<p>
-
<span id="numb"></span>
-
<span id="txt"></span>
-
</p>
-
-
<script type="text/javascript">
-
setInterval (function(){
-
var numObj = document.getElementById('numb');
-
var txtObj = document.getElementById('txt');
-
var currentNum = parseFloat(numObj.innerHTML);
-
-
numObj.innerHTML = currentNum + 1;
-
-
var numTxt = currentNum == 1 ? ' person has' : ' people have';
-
numTxt += ' died of hunger since you entered this webpage.';
-
-
txtObj.innerHTML = numTxt;
-
i++;
-
}, 7000);
-
</script>
-
</body>
-
</html>
I don't understand your last reply.
first I should mention that I omitted the definition for .bind() (it’s like a toolbox, there are functions, you always include, because they are damn useful).
the code would be: - Function.prototype.bind = function (obj) {
-
var fn = this;
-
return function () {
-
return fn.apply(obj, arguments);
-
}
-
};
OK, the prerequisite (between agbb0cg and myself) was
- no global variables.
thus I created an anonymous function (function () {}) which I immediately executed (by appending ();). any locally defined variables ( numb, update) are not global (well, stands to reason).
the code, how to increment the number is the same for both of us (there’s not much choice, if you don’t use a Closure).
the key difference in our update implementations, is how we access the element <p>. obviously, it is to get by ID. agbb0cg chose to use a DOM access each time the function executes. I chose to get the element once and bind this reference to the this in my update function (that’s where I use the (not so obvious) Closure from .bind()).
Please explain how it can be used.
as it stands there, the only thing to make sure is waiting for the <p> to be created (i.e. execute it at the end of the HTML)
@Dormilich
Your approach is fine! In fact, I'd probably go with yours in terms of performance, just for saying something...
I just thought that sometimes it's better to teach JS the basic way, the "pure-way" and also not just giving the answer to a problem.
I think my version it's easier to understand, edit and implement for a person who's asking how to do something like this, all of us have been there before...
Regards.
as you had given a working solution, my code was intended for you. (I am well aware, the code was way beyond a beginner’s understanding, though you didn’t seem to be a beginner)
Well, I have changed some of the code and now I have some working stuff.
"people have" will be changed to "person has" in this one. However, I cannot find a way to style the text. Any solutions? - <html>
-
<body>
-
<p>
-
<span id="numb">0 people have died of hunger since you entered this webpage.</span>
-
<span id="txt"></span>
-
</p>
-
-
<script type="text/javascript">
-
setInterval (function(){
-
var numObj = document.getElementById('numb');
-
var txtObj = document.getElementById('txt');
-
var currentNum = parseFloat(numObj.innerHTML);
-
-
numObj.innerHTML = currentNum + 1;
-
-
var numTxt = currentNum == 0 ? ' person has' : ' people have';
-
numTxt += ' died of hunger since you entered this webpage.';
-
-
txtObj.innerHTML = numTxt;
-
i++;
-
}, 7000);
-
</script>
-
</body>
-
</html>
For this one, I can style it but "people have" will not be changed. - <html>
-
<body>
-
<nobr id="numb" style="color:green;">0</nobr> <script type="text/javascript">
-
document.write("<span style=\"color:green;\">people have died of hunger since you entered this webpage.<\/span>");
-
-
setInterval (function(){
-
var numObj = document.getElementById('numb')
-
numObj.innerHTML = parseFloat(numObj.innerHTML) + 1;
-
i++;
-
}, 7000);
-
</script>
-
</body>
-
</html>
Thanks a lot for helping.
removing some overheat. -
<html>
-
<body>
-
<p>
-
<span id="numb"></span>
-
<span id="txt"></span>
-
died of hunger since you entered this webpage.
-
</p>
-
-
<script type="text/javascript">
-
setInterval (function(){
-
var numObj = document.getElementById('numb');
-
var txtObj = document.getElementById('txt');
-
var currentNum = parseFloat(numObj.innerHTML);
-
-
numObj.innerHTML = currentNum + 1;
-
-
var numTxt = currentNum == 1 ? ' person has' : ' people have';
-
txtObj.innerHTML = numTxt;
-
}, 7000);
-
</script>
-
</body>
-
</html>
-
just another idea - (function () {
-
var numb = document.getElementById("numb");
-
numb.count = 0;
-
function update() {
-
this.innerHTML = this.count++;
-
}
-
setInterval(update.bind(numb), 7000);
-
})();
Sign in to post your reply or Sign up for a free account.
Similar topics
by: steve |
last post by:
I am quite frustrated with php’s include, as I have spent a ton of
time on it already... anyone can tell me why it was designed like this
(or something I don’t get)?
The path in include is...
|
by: steve |
last post by:
Hi,
I need to do conditional script "include", but like to pull the code
from db instead of a file. How do I do that?
Reason: I like to implement some complex regex logic, and make it
table...
|
by: James Curran |
last post by:
I'd like to make the following proposal for a new feature for the C#
language. I have no connection with the C# team at Microsoft. I'm posting
it here to gather input to refine it, in an "open...
|
by: laredotornado |
last post by:
Hi,
I'm using PHP 4.4.4 on Apache 2 on Fedora Core 5. PHP was installed
using Apache's apxs and the php library was installed to
/usr/local/php. However, when I set my "error_reporting"...
|
by: Ulysse |
last post by:
Hello,
I need to clean the string like this :
string =
"""
bonne mentalité mec!:) \n <br>bon pour
info moi je suis un serial posteur arceleur dictateur ^^*
\n ...
|
by: Angus |
last post by:
I am trying to change the selection in Javascript - but this HTML element is
not a standard option control.
On the web page it looks like a dropdown list - and you click on the right
hand down...
|
by: Maria Sudderman |
last post by:
I have a prblem with the "onClick" command.
onClick="insert('<a href="URI">', '</a>')">
but this is not correct! why?
Maria
|
by: manchin2 |
last post by:
Hi,
Can anybody please provide the information about """ and its use, if possible please provide an example.
...
|
by: thaytu888888 |
last post by:
Here is my codes in aspx page:
<td colspan="2" class="main_menu" runat="server" onclick='toggleDisplay(<%#Eval("description")%>);'><%#Eval("description")%></td>
Here is in "View source":
...
|
by: jmash |
last post by:
Suppose I have the following string whch is part of an xml string:
String s= "Script Id="Test" "
And I need to get
s= "Script Id="Test" "
Can anyone tell me how this can acheived?
...
|
by: taylorcarr |
last post by:
A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...
|
by: Charles Arthur |
last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
|
by: aa123db |
last post by:
Variable and constants
Use var or let for variables and const fror constants.
Var foo ='bar';
Let foo ='bar';const baz ='bar';
Functions
function $name$ ($parameters$) {
}
...
|
by: ryjfgjl |
last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
|
by: BarryA |
last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
|
by: nemocccc |
last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
|
by: marktang |
last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
|
by: Oralloy |
last post by:
Hello folks,
I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>".
The problem is that using the GNU compilers,...
|
by: jinu1996 |
last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
| |
