Results 1 to 5 of 5

Thread: js in <option>

  1. #1
    Join Date
    Dec 2005
    Posts
    9
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Default js in <option>

    How do I execute js <option>, such as alert('Bla Bla Bla') ? I tried onselect, onmouseover, onclick, ect.

    <select>
    <option>Background Image</option>
    <option value="3">Bla Bla</option>
    <option value="2>Bla Bla</option>
    <option value="5">Bla Bla</option>
    </select>


    thanks

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,925
    Thanks
    43
    Thanked 3,190 Times in 3,154 Posts
    Blog Entries
    12

    Default

    Code:
    <select onchange="alert(options[selectedIndex].text);">
    <option>Background Image</option>
    <option value="3">Bla Bla</option>
    <option value="2>Bla Bla</option>
    <option value="5">Bla Bla</option>
    </select>
    or

    Code:
    <select onchange="alert(options[selectedIndex].value);">
    <option>Background Image</option>
    <option value="3">Bla Bla</option>
    <option value="2>Bla Bla</option>
    <option value="5">Bla Bla</option>
    </select>
    Depending upon what you are looking for.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Dec 2004
    Location
    UK
    Posts
    2,358
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Quote Originally Posted by jscheuer1
    <select onchange="alert(options[selectedIndex].text);">
    You're assuming that the select element is in the scope chain of that event listener. Don't. Use the this operator:

    HTML Code:
    <select onchange="alert(this.options[this.selectedIndex].text);">
    Mike

  4. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,925
    Thanks
    43
    Thanked 3,190 Times in 3,154 Posts
    Blog Entries
    12

    Default

    Quote Originally Posted by Mike
    You're assuming that the select element is in the scope chain of that event listener.
    Why wouldn't it be? It is the select element's event. My first inclination was to use the this operator but, it appeared unnecessary. Anyways, tested fine in several browsers.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  5. #5
    Join Date
    Dec 2004
    Location
    UK
    Posts
    2,358
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Quote Originally Posted by jscheuer1
    Why wouldn't it be? It is the select element's event.
    That's irrelevant. The scope chain is determined by the execution context when a function object is determined. As listeners created using intrinsic event attributes are internal, this environment can, and does, differ between implementations.

    My first inclination was to use the this operator but, it appeared unnecessary.
    Appearances can be deceiving.

    Anyways, tested fine in several browsers.
    All that proves is that custom scope chains are common among the browsers you tested, and I'm not disputing that. To be honest, I haven't personally encountered an exception either, but I don't have access to a wide variety of browsers. However, I do have anectotal evidence from another source that has seen this assumption fail.

    Custom scope chains differ from being non-existent, to including the element, the element and the form, and even to including all DOM objects between the element and the global object. Given this variety, it is simpler to be aware of the existence (as it can adversely impact code in some instances), but to write code that ignores it. After all, given a choice between something that does work, and something that only might, which is the most logical? Especially when the difference between them is only five characters.

    Mike

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
  •