X Library Forums
You are not logged in.
New user registration is currently disabled.
I have a text input and I want to handle the input's value when it changes. In IE and Firefox, I can do:
function handleChange() {
var v = this.value;
...
}
var i = document.createElement('input');
i.type = 'text';
i.onchange = handleChange;
and pressing Enter or clicking in another field triggers handleChange() but in Opera, Enter doesn't do that. I tried adding this:
function handleKeyup(event) {
var evt = new xEvent(event);
if (evt.keyCode == 13) {
handleChange.call(this);
return false;
}
return true;
}
...
xAddEventHandler(i, 'keyup', handleKeyup, false);
and now pressing Enter triggers handleChange() twice in Opera. Any thoughts...
Offline
I found that if I specify just the key handler in Opera, it works. It's as if the onchange handler doesn't work unless there's a key handler.
I also found an article ( http://forums.openqa.org/thread.jspa?messageID=4463 ) which notes Opera doesn't have full support for onchange in inputs.
So, I'd like to do:
if (testForOpera) {
// set up key handler
}
else {
// set up onchange handler
}
But I'm not sure what to test.
Offline
if (!!window.opera)
{
alert('you are running opera);
}
i don't undertsand the use of !! but opera segfault (bug and stop) without it on my box!
you can also use
if ( navigator.userAgent.toLowerCase().agt.indexOf("opera") != -1)
{
alert("opera!");
}
Ref: http://www.ewanmellor.org.uk/chip/chip.php?file=/javascript/sniffer.js&bcURL0=index.html&bcTitle0=Ewan+Mellor&bcURL1=/javascript/index.html&bcTitle1=JavaScript
Offline
Per the spec, pressing enter is not supposed to fire the change event. The change event occurs when a control loses focus and its value has changed.
In IE pressing enter focuses the submit button - so the text input loses focus and this causes a change event.
In FF pressing enter does not focus the submit button, yet the change event still occurs.
In Opera neither of the above occurs. One work-around is to call the text input's blur method when enter is pressed. This works but the change event doesn't fire until after the submit event.
I experimented with it some...
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Text Input OnChange Event</title>
<script type='text/javascript'>
window.onload = function()
{
var e, i, d = document.getElementById('div1');
var f = document.getElementById('form1');
for (i = 0; i < 3; ++i) {
e = document.createElement('input');
e.id = e.name = 'txt' + i;
e.type = 'text';
e.onchange = onEvent;
e.onblur = onEvent;
e.onfocus = onEvent;
e.onkeydown = onEvent;
d.appendChild(e);
}
f.onsubmit = onEvent;
};
function onEvent(e)
{
e = e || window.event;
var s = 'element.id: ' + this.id + ', event.type: ' + e.type;
if (e.keyCode) s += ', event.keyCode: ' + e.keyCode;
msg(s);
if (window.opera && e.type == 'keydown' && e.keyCode == 13) this.blur();
if (e.type == 'submit') return false;
return true;
}
function msg(s)
{
document.getElementById('dbg').innerHTML += '<p>' + s + '<\/p>';
}
</script>
</head>
<body>
<form id='form1' action='test.html'>
<div id='div1'>
</div>
<div>
<input type='submit'>
<input type='button' value='Clear Msgs' onclick="document.getElementById('dbg').innerHTML = ''">
</div>
</form>
<div id='dbg'>
</div>
</body>
</html>
(select 'Load' to run the above)
Offline