By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,528 Members | 1,345 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,528 IT Pros & Developers. It's quick & easy.

How to assign event handler in css?

P: n/a
I'm guessing the answer is no, but is it possible to assign an event
handler to a control using css?

For example, I'd like to assign an onclick handler to every <divthat
has a class of "foo". Possible?

div.foo {
onclick: myFunction(this);
}
Nov 13 '08 #1
Share this Question
Share on Google+
3 Replies


P: n/a
On Nov 14, 8:04 am, Chris <spam_me_...@goaway.comwrote:
I'm guessing the answer is no, but is it possible to assign an event
handler to a control using css?
For some value of “possible”, yes, you can.

For example, I'd like to assign an onclick handler to every <divthat
has a class of "foo". Possible?

div.foo {
onclick: myFunction(this);

}
There are various libraries that allow selection of elements using a
CSS-style selector, returning an array of the selected elements. Some
use a mixture of XPath and native functions, others just native. The
call would be something like:

var nodeArray = selector(‘div.foo’, rootNode);
XPath is not widely implemented, but for those UAs that have it, it’s
very fast (host-level functions tend to be much faster than equivalent
native javascript functions).

Have a look at how those libraries do it, or you could write your own
simple function that implements just the selectors you need - things
like getElementsByClassName are supported by some browsers and pretty
simple to implement otherwise.

Where host support is provided, a NodeList (a live list of the
selected elements) is generally returned (mimicking the behaviour of
getElementsByTagName) whereas native javascript methods tend to return
a javascript Array.
--
Rob
Nov 13 '08 #2

P: n/a
Chris wrote:
I'm guessing the answer is no, but is it possible to assign an event
handler to a control using css?

For example, I'd like to assign an onclick handler to every <divthat
has a class of "foo". Possible?

div.foo {
onclick: myFunction(this);
}
Event bubbling instead is usually more efficient. Example:-
function documentClickHandler(ev) {
ev = ev || window.event;
var target = ev.target || event.srcElement;

// If the user did not click a paragraph, exit.
if(!/p/i.test(target.tagName) return;

target.innerHTML = "you clicked me!";

}

document.onclick = documentClickHandler;
--
comp.lang.javascript FAQ <URL: http://jibbering.com/faq/ >
Nov 15 '08 #3

P: n/a
Chris wrote:
I'm guessing the answer is no, but is it possible to assign an event
handler to a control using css?

For example, I'd like to assign an onclick handler to every <divthat
has a class of "foo". Possible?

div.foo {
onclick: myFunction(this);
}
Event bubbling instead is usually more efficient. Example:-
function documentClickHandler(ev) {
ev = ev || window.event;
var target = ev.target || ev.srcElement;

// If the user did not click a paragraph, exit.
if(!/p/i.test(target.tagName) return;

target.innerHTML = "you clicked me!";

}

document.onclick = documentClickHandler;
--
comp.lang.javascript FAQ <URL: http://jibbering.com/faq/ >
Nov 15 '08 #4

This discussion thread is closed

Replies have been disabled for this discussion.