/    Sign up×
Community /Pin to ProfileBookmark

span to text feild…

Hello there. I am creating a thing where I use JavaScript to display how far a users mouse has travelled. I have succeeded in this but now I need to know how to do something else. THe specific code I use to display the number is as follows:

<span id=”km” class=”deafault”></span>

What I would like to know is how can I display the number in a text box, like on a form, e.g. <imput type=”text” etc…….

Please help me. Cheers for reading this.

to post a comment
JavaScript

6 Comments(s)

Copy linkTweet thisAlerts:
@PittimannJul 29.2004 — Hi!

Most likely, in you span variant, you say something like:

document.getElementById('km').innerHTML=something

Just give that id to a textfield instead and say:

document.getElementById('km').value=something

Cheers - Pit
Copy linkTweet thisAlerts:
@eviljoker7075authorJul 30.2004 — Ok I tried that thing, but it didn't work... perhaps it'll help if I give you all the code, instead of just some of it:

I have this onload code:

var oldX=0, oldY=0, dpx = 0;

oldX = mio.mouse.x();

oldY = mio.mouse.y();

I use this onmousemove code:

inchesperpx = 1/84;

acc = 0; //

dist = Math.abs(oldX - mio.mouse.x()) + Math.abs(oldY - mio.mouse.y());

dpx+=dist;

dinches = Math.round(dpx*inchesperpx*Math.pow(10,acc))/Math.pow(10,acc);

inches.innerHTML = dinches +" inches";

oldX = mio.mouse.x();

oldY = mio.mouse.y();

I have this script to put on the page above the span bit, this is between two <script> tags:

function reset() {

dpx = 0;

dinches = 0;

inches.innerHTML = "0 inches";

}

and then finally the bit I gave you earlier:

<span id="inches" class="default"></span>


Does that help?
Copy linkTweet thisAlerts:
@BillyRayJul 30.2004 — Replace this:

&lt;span id="inches" class="default"&gt;&lt;/span&gt;
with this:

&lt;input id="inches" type="text" /&gt;
And that should replace your span with a tetx input.

Hope this helps,

Dan
Copy linkTweet thisAlerts:
@PittimannJul 30.2004 — Hi!

Not to be forgotten:

inches.innerHTML = "0 inches";

inches.innerHTML = dinches +" inches";

=>

inches.value = "0 inches";

inches.value = dinches +" inches";

As I guess, that the coordinate stuff is IE only as well, I don't comment it further.

Cheers - Pit
Copy linkTweet thisAlerts:
@eviljoker7075authorJul 30.2004 — Excellent! That did it! Cheers dudes!

However, there is another sleight problem... I needed to convert it to a text feild because I can get the browser to save values of a text feild. So what happens is people move the mouse, when they're finished they save the value so that next time the thing opens they can carry on from where they left of. The thing is: it saves fine, and when the thing opens again the value automatically returns to the box, however as soon as the mouse is moved the whole thing starts again from 0. I think it's because it doesn't recognise the text box is already full.

Is there something in the code above I need to change to tell it not to start from 0?

Please help. And thank you very much for the help so far!
Copy linkTweet thisAlerts:
@PittimannJul 30.2004 — Hi!

Just a guess: do you want the value to change only if higher than last time? Or do you only want to display the formerly saved value?

And what is behind all that?

Cheers - Pit
×

Success!

Help @eviljoker7075 spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.28,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...