打開選擇使用javascript單擊另一個元素

Question

我一直在尋找一種打開select / combobox點擊另一個元素的方法。 我讀到的答案說這是不可能的但是...... facebook是如何做到的？

在你的Facebook時間線中，當你想要更改狀態的日期時，有一個ahchor，當你點擊它時，會出現一個組合框。 我認為他們已經將樣式應用於他們的選擇，所以它看起來像錨，但它不是那樣的。

他們的HTML代碼有一個錨和一個選擇元素，最后一個是隱藏的。 然后，我知道select元素定位為絕對，但我無法從他們的javascript代碼中獲取它是如何工作的。

我試着像這樣模擬它

$('#element').click();
document.getElementById('element').click();

這些都不起作用。 我看到一個復制SELECT元素的腳本，但它為它添加了2個屬性：multiple和size。 這會改變選擇的外觀。

我想知道它怎么可能？ 我知道也許它不會在IE <9中起作用。

Answer 1

我們在談論這個？

<span class="period periodDay">
   <a class="uiIconText periodLabel" style="padding-left: 11px;"><img class="img" src="https://s-static.ak.facebook.com/rsrc.php/v1/yo/r/5-fr6z6ewzf.png" alt="" style="top: 4px;" width="6" height="6" />Tag hinzufügen</a>
   <select data-name="day" class="periodMenu dayMenu" name="backdated_date[day]">
      <option value="">Tag:</option>
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="2">more days...</option>
   </select>
</span>

<a>標簽位於<select>上方，點擊通過管道傳遞。 如果單擊右端的鏈接則不起作用。

更新

您可以使用此技巧打開選擇。 將選擇放在錨點下方，然后在單擊后移動錨點。

<select id="moveme" style="position: relative;"
    onmousedown="$('#moveme').css('left', '100px');">
  <option value="">Tag:</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="2">more days...</option>
</select>​

演示： http ： //jsfiddle.net/HfFWr/1/

在Firefox，Chrome和IE中測試過。