Something like this:
(bunch of checkboxes here)
<div id="message" style="position:fixed; top: 100px, left:100px;
padding:3px; border:1px solid red;"></div>
<script type="text/javascript">
var all = $$('input[type="checkbox"]');
document.observe('click',function(){
var current = all.select(function(elm){return elm.checked;});
$('message').update(current.toString() + ' out of ' + all.toString()
+ ' selected');
});
</script>
On Firefox, this just works. The message updates each time the form is
clicked, and the number stays in synch with the total number of
checkboxes checked. In Safari, clicking doesn't change the message
until you scroll the page a little bit. Then it seems to gather its
thoughts and update the message area. I tried all sorts of stuff
(adding and removing a text node a la Scriptaculous, for example) to
try to get it to update, and only had intermittent success. What
finally fixed it was to get rid of the position:fixed and replace it
with position:absolute plus a scroll observer to reposition the
message div. Hacky, for sure.
Walter