Unable to change select option with mouse when select is inside an anchor




10 years ago
10 years ago


(Reporter: johnnyh749, Unassigned)



Firefox Tracking Flags

(Not tracked)



(2 attachments)



10 years ago
User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv: Gecko/20090729 Firefox/3.5.2
Build Identifier: Firefox 3.7a1pre

When a select tag is inside an anchor tag (e.g. <a href="#"><select><option>one</option><option>two</option></select></a>), a user is unable to change the selected option using the mouse.

Use Case: When using the select as an bookmark/anchor within the page.  Specifically, the Yahoo UI TabView wraps tab labels in an A tag. Due to this issue, one can not use a select tag inside a tab label. (See also: http://yuilibrary.com/projects/yui2/ticket/2528333)

I am not sure if this represents valid HTML, but the W3C Validator indicates that it is valid HTML 4.01 Strict and HTML 4.01 Transitional

Reproducible: Always

Steps to Reproduce:
1. Create an HTML document with a SELECT tag inside an A tag (e.g. <a href="#"><select><option>one</option><option>two</option></select></a>).
2. Click on the select control
3. With the mouse, try to change to selected option (in the example in #1, click on the "two" option)
Actual Results:  
The select pull-down list disappears but the value of the select box does not change. In the example, "one" is still displayed in the select box.

Expected Results:  
The select box should display what was click on in step #3 (i.e. "two")

While using the mouse does not work, a user is still able to use the keyboard to selected the desired option once focus is given to the select box.

The issue appears Firefox in Windows and Linux, but not in Mac OS X. Opera (Win XP), Safari (Win XP & OS X), Chrome, IE (7 & 8), and Firefox (OS X only) all exhibit the expected <select> behavior. 

Issue is present:
Firefox 3.5.2 - Win XP Pro
Firefox 3.7a1pre - Win XP Pro
Seamonkey 2.0b2pre - Win XP Pro
Firefox 3.5.1 - Fedora

Issue is *not* present:
Firefox 3.5.2 - Mac OS X

Comment 1

10 years ago
Created attachment 395359 [details]
Simple illustration of the issue


10 years ago
Summary: Unable to change select option with mouse when select is inside in anchor → Unable to change select option with mouse when select is inside an anchor

Comment 2

10 years ago
If one removes the href from the anchor tag, this issue disappears:

e.g. <a><select><option>one</option><option>two</option></select></a> works as expected
Sure, since in that case it's not a link.  For what it's worth, I see the problem just fine in Firefox on OS X.

Mats, any idea what's going on here?
Ever confirmed: true
Keywords: helpwanted
Created attachment 396371 [details]
with some JS event tracing

Very odd.  I would have to trace C++ to see what's going on here.

FWIW, I also noticed that we handle nested links different from other UAs.
Should we really end up at #outer when clicking "inner"?
(may be unrelated to the reported problem though)
You need to log in before you can comment on or make changes to this bug.