Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations Mike Lewis on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

How to dynamically remove title attribute

Status
Not open for further replies.
210163

210163

Programmer
Jun 15, 2008
7
NO
Hi!

I´m a newbie to JavaScript programming, and I wonder how to create a function to let a user remove all title attributes of my page´s links. By implementing this funtion I let my users have the opportunity to disable tooltips, which I provide thorugh the title attribute.

I have tried this, but without success:

document.getElementsByTagName("a").removeAttribute("title");
 
Sort by date Sort by votes
You are currently getting an array of anchor tags by calling getElementsByTagName, but then you need to apply removeAttribute to each array element, not to the entire array object. Something like this...
Code: 
  var anchorTags;
  anchorTags = document.getElementsByTagName("a");
  for(var i = 0; i < anchorTags.length; i++) {
    anchorTags[i].removeAttribute("title");
  }

Clive
Runner_1Revised.gif

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
"To err is human, but to really foul things up you need a computer." (Paul Ehrlich)
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
To get the best answers from this forum see: faq102-5096
 
Upvote 0 Downvote
Hi!

I have tried to put this in my <head> tag:

<script type="text/javascript">
function removeTooltip() {
var anchorTags;
anchorTags = document.getElementsByTagName("a");
for(var i = 0; i < anchorTags.length; i++)
anchorTags.removeAttribute("title");
}
</script>

And added this to my checkbox:

Hide tooltip <input type="checkbox" onClick="removeTooltip()" />

Yet still the title attributes are there. Can you see anything wrong with my code?

Thanks.
 
Upvote 0 Downvote
After checking the checkbox the tooltips do not appear for me in both IE7 and FF2.

210163 said:
Yet still the title attributes are there.
Click to expand...
Do you mean when viewing the HTML source code, the title attributes are still present?

OR

Do you mean the tooltips still appear after checking the checkbox?

Clive
Runner_1Revised.gif

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
"To err is human, but to really foul things up you need a computer." (Paul Ehrlich)
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
To get the best answers from this forum see: faq102-5096
 
Upvote 0 Downvote
An alternative to removing the attribute might be to set the title attribute to an empty string e.g. replace removeAttribute("title") with setAttribute("title", "").

Clive
Runner_1Revised.gif

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
"To err is human, but to really foul things up you need a computer." (Paul Ehrlich)
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
To get the best answers from this forum see: faq102-5096
 
Upvote 0 Downvote
It´s my tooltip that still is there.

I did a check WITHOUT my tooltip - Bubble Tooltips ( - and then the default tooltip of IE and FF just worked fine (they disappeared)!

So I guess the error comes from my combination of Bubble Tooltips and the function removeTooltip(). But I don´t know why the function doesn´t work with Bubble, as Bubble traverses the links of my page to add it´s tooltip bubble to those with a title attribute.
 
Upvote 0 Downvote
210163 said:
...Bubble traverses the links of my page to add it's tooltip bubble to those with a title attribute
Click to expand...
I just tried Bubble with a link that had no title and it still appeared, except instead of a title it printed the word "link:".

Coming from a different angle, you could reassign the onmouseover event handler of each link with the hideTooltip function from BubbleTooltips.js.
Code: 
function removeTooltip() {
  var anchorTags;
  anchorTags = document.getElementsByTagName("a");
  for(var i = 0; i < anchorTags.length; i++) {
    anchorTags[i].setAttribute("title","");
    anchorTags[i].onmouseover = hideTooltip;
  }
}

Clive
Runner_1Revised.gif

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
"To err is human, but to really foul things up you need a computer." (Paul Ehrlich)
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
To get the best answers from this forum see: faq102-5096
 
Upvote 0 Downvote
Ahh, this is really nice! Your solution seems easy and beautiful.

But I noticed that all the tooltips "stay" disapperead after me unchecking the checkbox. Do you have an idea to retrieve all the title attributes?

Many thanks again!
 
Upvote 0 Downvote
Something like this would work:
Code: 
function toggleTooltip(checkbox) {
  var anchorTags;
  anchorTags = document.getElementsByTagName("a");
  for(var i = 0; i < anchorTags.length; i++) {
    if(checkbox.checked) {
      anchorTags[i].onmouseover = hideTooltip;
    } else {
      anchorTags[i].onmouseover = showTooltip;
    }
  }
}
...and...
Code: 
Hide tooltip <input type="checkbox" onClick="toggleTooltip(this)" />

Clive
Runner_1Revised.gif

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
"To err is human, but to really foul things up you need a computer." (Paul Ehrlich)
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
To get the best answers from this forum see: faq102-5096
 
Upvote 0 Downvote
It worked just fine in both IE and FF!

I´m going to link to this thread from Bubble Tooltips homepage, as I think this function is quite practical to us JavaScript newbies.

Thanks a lot! You must made my day.
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

jomat
  • Locked
  • Question
JS to show the timer in html under title instead of in the status bar
Replies
2
Views
375
xwb
xwb
Kennelbloke
  • Locked
  • Question
Can't Get Markers to show on Map
Replies
0
Views
399
Kennelbloke
Kennelbloke
Rayj0000
  • Locked
  • Question
How to disable an html button for subsequent website visitors?
Replies
0
Views
294
Rayj0000
Rayj0000
lexer
  • Locked
  • Question
Passing fields from (html-JavaScript) table to JavaScript Function
Replies
0
Views
333
lexer
lexer
AbidingDude
  • Locked
  • Question
Where Does The &quot;name&quot; Attribute Stand?
Replies
1
Views
131
gmmastros
gmmastros

Part and Inventory Search

Sponsor

Back
Top