/    Sign up×
Community /Pin to ProfileBookmark

Firefox className problem

I had several problems with firefox, when I was designing online applications with lots of scripts. This time, I need to create a list of items that can be selected and “deleted”, just like in the classic Yahoo! Mail. I used a table row for each item. The table rows have [I]class=”m_normal”, onmouseover=”h(‘my-id’)” onmouseout=”h(‘my-id’)” onmousedown=”s(‘my-id’)”[/I]. These two functions, h() and s() are used to highlight the items chosen by the user.

[CODE]function s(obj){

if(eval(‘m’+obj).className==’m_hover’){

eval(‘m’+obj).className=’m_selected’;

} else {
if(eval(‘m’+obj).className==’m_selected’)

eval(‘m’+obj).className=’m_hover’;

}

}

function h(obj){

if(eval(‘m’+obj).className==’m_normal’){

eval(‘m’+obj).className=’m_hover’;

} else {
if(eval(‘m’+obj).className==’m_hover’)

eval(‘m’+obj).className=’m_normal’;

}

}[/CODE]

This has no effect under Firefox, while under IE works perfectly. I even tried to use setAttribute(“className”,”whatever”) and getAttribute(“className”,”whatever”). How can I make this script work in Firefox too? And because we were talking about Firefox, here is another question: why innerHTML and innerText doesn’t work correctly in Firefox?

to post a comment
JavaScript

3 Comments(s)

Copy linkTweet thisAlerts:
@gil_davisFeb 01.2008 — First, the "eval" function is evil. It should be avoided at all costs. Instead of:
if(eval('m'+obj).className=='m_hover'){[/quote]
you can use:if (document.getElementById("m" + obj).className == "m_hover") {This should work fine in IE.

Setting the className does not work in FF. You will have to usedocument.getElementById("m" + obj).setAttribute("class", "m_selected");

Second, innerText and innerHTML are Microsoft inventions that are not part of the W3C recommendation. Although FF supports innerHTML, they do not support innerText.
Copy linkTweet thisAlerts:
@chri5tyauthorFeb 01.2008 — Thanks a lot! Now it works perfectly in IE and FF.
Copy linkTweet thisAlerts:
@toicontienFeb 01.2008 — Setting the className does not work in FF.[/QUOTE]
Firefox works just fine when setting the className property of a DOM node. If it's not working, perhaps there is another problem with the code elsewhere? I routinely set the className attribute cross-browser, and don't run into any problems.

The .setAtribute() way of setting the class is technically the standard way though. It's a standard document object model function.
×

Success!

Help @chri5ty 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 6.16,
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: @nearjob,
tipped: article
amount: 1000 SATS,

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

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,
)...