Wie kann ich verhindern, dass das Dropdown in einer DropDownList geöffnet wird?

Question

Ich habe eine benutzerdefinierte Tabelle, die ich als DropDown-Teil als DropDownList verwenden möchte.

Idealfall, wenn Benutzer auf einem DropDownList klicken, sollte es die benutzerdefinierte Tabelle statt der üblichen Dropdown zeigen. Ich dachte, es wäre einfach zu verhindern, dass das Dropdown-Menü geöffnet wird, ohne das DropDownList-Steuerelement zu deaktivieren. Dies scheint jedoch nicht der Fall zu sein.

Gibt es eine einfache Möglichkeit zu verhindern, dass sich ein DropDownList öffnet, ohne es zu deaktivieren?

Edit: Dies hat für einen eingebetteten IE 7 Web-Browser zu arbeiten, und e.preventDefault() funktionieren nicht in dieser Browserversion

Answer 1

Sie können etwas tun:

Grundsätzlich habe ich einen unsichtbaren div über den Drop-Down positionierte ihn zu blockieren, und Sie können den Klick mit dem Onclick Griff der Maskierung div.

EDIT: Ich habe diese aktualisiert http://jsfiddle.net/EdM7B/1/

<div id='mask' onclick='alert("clicked");' style='width:200px; height:20px; position:absolute; background:white;filter:alpha(opacity=0);'></div> 
<select id='selectList' show=1 style='width:200px; height:20px;'> 
    <option>Test</option> 
</select> 

Ich hatte eine Art von Hack zu benutzen, weil IE divs scheint nicht richtig zu machen, die keine Hintergrundfarbe festgelegt haben, so war es funktioniert nicht richtig . Das funktioniert in meinem IE7.

Wenn Sie möchten, dass es in allen Browsern funktioniert, müssen Sie chrome/firefox opacity CSS hinzufügen oder einige IE nur CSS verwenden, um Hintergrundfarbe anzuwenden.

Ich denke, aufgrund der Art, wie es oben positioniert ist, funktioniert die Opazität nicht richtig, weil das Element absolut positioniert ist, so wie es auch zu funktionieren scheint. Ich hatte es ursprünglich als Opazität 1, aber das klingt falsch für mich, wie wir es unsichtbar wollen, so änderte ich es auf 0.

Answer 2

Haben Sie sich Gedanken über ein mega menu dafür verwenden, können Sie alles, was Sie wollen, setzen in die fiel nach unten Teil - zum Beispiel Tisch

Answer 3

es so in einem div Put:

<div id="dllDiv" style="width:200px;height:200px;"> 
     < asp:DropDownList ID="DropDownList1" runat="server" style="z-index:-1000px;pointer-events:none;"> 
     < /asp:DropDownList> 
    </div> 

Sie sollten die CSS-Eigenschaft Zeiger-e gesetzt Lüftungsschlitze keine, dann können Sie Ihre Tabelle in einem div versteckt zeigen oder geladen es Ajax, so etwas wie dies durch den Einsatz:

(document).ready(function() { 
     $("#dllDiv").click(function() { 
      alert('adasd'); 
     }); 
    }); 

Answer 4

Es ist möglich, die Dropdownlist aus zeigt, die durch Verwendung von jQuery event.preventDefault im mousedown Ereignisse (Demo zu stoppen : http://jsfiddle.net/RCCKj).

Auch diese Frage im Zusammenhang sehen: stop chrome to show dropdown list when click a select