SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Wizard Zaggs's Avatar
    Join Date
    Feb 2005
    Posts
    1,048
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    javascript set attribute question

    Hi Guys,

    I have the following <div> section in my HTML which has the following default value:

    Code:
    <div id="roomdiv" style="display:none;">
    My question is, how can I change the default style to "display:inline;" when an onClick function is triggered like so:

    Code:
    <a href="#" onClick="changeStyle();">
    Thanks in advance.

  2. #2
    I meant that to happen silver trophybronze trophy Raffles's Avatar
    Join Date
    Sep 2005
    Location
    Tanzania
    Posts
    4,662
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Code:
    function changeStyle() {
      document.getElementById('roomdiv').style.display = 'inline';
    }
    This is better:
    HTML Code:
    <div id="roomdiv">Stuff</div>
    <a href="#" id="somelink">Clicky</a>
    CSS:
    Code:
    #roomdiv {display:none;}
    Javascript in the <head>:
    Code:
    window.onload = function() {
      document.getElementById('somelink').onclick = function() {
        document.getElementById('roomdiv').style.display = 'inline';
      }
    }

  3. #3
    SitePoint Wizard Zaggs's Avatar
    Join Date
    Feb 2005
    Posts
    1,048
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi,

    Thanks for that seems to be working now. However, "display:none" does not seem to do what I need it to do. It is supposed to hide some form elements, which it does, but they still get posted even though they are not shown. How do I prevent them from getting posted?

  4. #4
    SitePoint Zealot
    Join Date
    Jul 2006
    Posts
    151
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Try including a line that sets the form field to disabled. So for example:

    Code:
    window.onload = function() {
      document.getElementById('somelink').onclick = function() {
        document.getElementById('roomdiv').style.display = 'inline';
        document.getElementById('roomdiv').disabled = true;
      }
    }

  5. #5
    I meant that to happen silver trophybronze trophy Raffles's Avatar
    Join Date
    Sep 2005
    Location
    Tanzania
    Posts
    4,662
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Except that
    Code:
    document.getElementById('roomdiv')
    isn't a form field so make sure you're disabling an <input> or whatever form field it is.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •