9

When the select box is clicked, a drop down list of options is displayed. The drop down list stays open until the user clicks outside or selects one of the options in the drop down list.

Is there a simple way of making the drop down list be displayed when user enters page? Like autofocus but better. Similar to how amazon displays it's menu automatically.

I understand that I could probably just make a ul dropdown list + javascript and etc, but was wondering whether there was a way of doing it with select using html or javascript.

user81779
  • 307
  • 2
  • 3
  • 7
  • usually items in dropdownlist are hidden, on body load, you can use .show() in jquery for that particular div. – Saswata Sundar Apr 05 '13 at 06:09
  • You can try adding `size=5` attribute in your ` – Ketan Modi Apr 05 '13 at 06:16
  • 1
    FYI. This question is over 5 years & 8 months old. Amazon doesn't seem to have this feature on it's current home page. Which makes me wonder why it was bumped to the home page by the community? Anyhow, it would be helpful to see a screenshot of what this refers to: "Similar to how amazon displays it's menu automatically." If this answer is still desired, it should be pretty easy for someone to figure out in jsfiddle. :) – Clomp Dec 19 '18 at 05:18
  • 1
    @Clomp The Community user periodically bumps questions that have answers which aren't upvoted or accepted because it views those as situations where OP is still waiting on a potential solution. In most cases, OP actually just abandoned the question (or site), but the system isn't smart enough to consider that. – TylerH Dec 16 '19 at 22:14

2 Answers2

1

you can do it with j query(but i think it is not exactly some thing that you need)

Html Code

<select class="select1" size="5" style="display:none">        
    <option name="test" value="" class="first">Select</option>       
    <option name="test" value="" class="">Opt1</option>       
    <option name="test" value="" class="">Opt2</option> 
</select>

Java script

$(document).ready(function() {
    $('.select1').toggle();
    $(document).click(function(e) {
  $('.select1').attr('size',0);
});
});

Demo

KF2
  • 9,887
  • 8
  • 44
  • 77
  • That's not how I was hoping it to behave. Regardless, it seems that the select element is just very limited. That's probably why people have bothered developing list menus in the first place lol. – user81779 Apr 05 '13 at 17:04
0

You can easily simulate a click on an element, but a click on a <select> won’t open up the dropdown.

Using multiple selects can be problematic. Perhaps you should consider radio buttons inside a container element which you can expand and contract as needed.

John
  • 539
  • 1
  • 4
  • 15