最近、ユーザーが選択できるように、いくつかのドロップダウンリストボックスをロードする必要があります。サーバー側にロードされており、使用する必要があることがわかります。最後に、ビジネスロジックの考慮事項により、ドロップダウンリストの関数の一部をクライアントの実装に入れる必要があります。これで、ドロップダウンリスト関数は、サーバー側に置くときよりもはるかに良く感じられます。
具体的な方法：
ドロップダウンリストコントロールをページに入れて、生成するHTMLコードを分析するアイテムを追加します。これにより、JSを動的制御に使用する場合、テストコードは次のように非常に明確になります。
<asp：dropdownlist id = "dropdownlist1" runat = "server"> <asp：listitem> 1 </asp：listitem> </asp：dropdownlist>
ブラウザで表示し、HTMLを分析します。以下は、ドロップダウンリストコントロールによって生成されたHTMLコードです。普通の選択のようなものはありません
違いがあります。次に、JSを介して動的に埋め、削除、選択、およびその他のコントロールを使用できます。
<select name = "dropdownlist1" id = "dropdownlist1"> <option value = "1"> 1 </option> </select>
<ASP：listItem> 1 </asp：listitem>を削除でき、2つのHTMLボタンコントロールを追加してオプションの追加を実装し、それぞれすべてのオプションを削除します。ボタンソースコードは次のとおりです。
<入力id = "button1" type = "button" value = "add option" onclick = "addoption（）" /> <入力id = "button2" type = "button" bulate "bulate" onclick onclick = "deloption（）" />
関数の追加と削除は次のとおりです。
function addoption（）{var ddlobj = document.getElementById（ "dropdownlist1"）; // get object if（ddlobj.length> 0）deloption（）; //すべてを最初に削除してから、var opttext = new Array（ "Founder"、 "china"、 "beijing"）; ooption = null; for（var i = 0; i <opttext.length; i ++）{ooption = new option（opttext [i]、optvalue [i]）; ddlobj.options.add（oooption）;}} function deloption（）{var dlobj = document.getelementbyid（// i = ddlobj.length-1; i> = 0; i-）{ddlobj.remove（i）; // firefoxはddlcurselectkey.options.remove（）、両方のサポート}}}をサポートしていません}ブラウザで表示すると、選択したドロップダウンオプションを簡単に作成できます。これらは、クライアントで生成されているため、サーバーよりも効率的です
側面で動作するコード。ただし、この時点で、dropdownlist1.selectedValueを使用してユーザーが選択したオプションを取得する場合は、
エラーがありました。これは、ドロップダウンリストがJSによって動的に追加されているため、そのアイテムはViewStateに属しておらず、維持されていないためです。
つまり、サーバー側でそれを処理することはできません。この問題を解決するには、使用する方法は2つあります。1。隠しコントロールを保存します
ユーザーオプションメソッド。 2。request.formメソッド。 （msdn taste ajaxを参照）
1.ページに隠されたコントロールを追加し、それを使用して、ドロップダウンリストのオプションの変更に関する情報を保存して、ユーザーが選択した感覚になるように
関心のある情報が得られた後、サーバー上の情報を取得し、それを処理して、顧客とサービスの間の労働部門を合理的に実現できます。
ドロップダウンリストコントロールにオンチェンジイベントを追加すると、そのHTMLコードは次のとおりです。
<asp：dropdownlist id = "dropdownlist1" runat = "server" onchange = "resvitem（）"> </asp：dropdownlist>
オンチェンジイベントは次のとおりです。このイベントは、主にユーザーが選択した値を保存します。
function resvitem（）{var objddl = document.getElementById（ "dropdownlist1"）; document.getElementbyId（ "hiddenfield1"）。value = objddl.options [objddl.selectedindex] .value;}この後、ASP：ボタンコントロールを使用して結果をテストします。
保護されたvoid button1_click（object sender、eventargs e）{respons.write（hiddenfield1.value）;}この時点で、すべての作業が完了しましたが、まだ問題があります。ドロップダウンリストの変更イベントは、ユーザーがドロップダウンを変更したときにのみ選択されます。
アイテムがあるときにのみトリガーされます。したがって、ユーザーがデフォルトのオプションで提出すると、null値が取得されます。したがって、オプションを埋めるときは、できます
隠された初期化。次のように、ADDOPTIONイベントにコードの行を追加します。
function addoption（）{var ddlobj = document.getElementById（ "dropdownlist1"）; // get object if（ddlobj.length> 0）deloption（）; //すべてを最初に削除してから、var opttext = new Array（ "Founder"、 "china"、 "beijing"）; ooption = null; for（var i = 0; i <opttext.length; i ++）{ooption = new option（opttext [i]、optvalue [i]）; ddlobj.options.add（oooption）;} document.getelementbyid（ "hiddenfield1"）。ただし、上記の赤い部分はTTブラウザの下でのADDで成功しておらず、他のブラウジングをまだ試していません。これが別の書き方です：
function getDeptList（）{var ddlcityType = document.getElementById（ "ddlcityType"）; var ddlposition = document.getElementById（ "ddlposition"）; var v = ddlcitytype.options [ddlcitytype.seletedindex]; deptlist = guest_userregister.getDeptList（v.Value）.Value; var deptlist = new Array（）; deptlist = deptlist.split（ ';'）; dept = deptlist [i] .split（ '、'）; var opt = document.createelement（ "option"）; opt.innerhtml = dept [1]; opt.value = dept [0]; ddlposition.insertbefore（opt、ddlposition.firstchild）;}}} function deloption（）{var ddluserschool = document.getelementbyid（ "ddlusschool"）; var num = ddluserschool; while（num> 0）{for（var j = 0; j <num; j ++）{ddluserschool.remove（j）;} num = ddluserschool.length;}} function getschoollist（）{deloption（）; var ddlprovince = document.getElementid（ddlprovince "; document.getElementById（ "ddluserschool"）; var v = ddlprovince.options [ddlprovince.selectedIndex]; var deptlist = guest_userregister.getschoollist（v.value）.value; var deptlist = new Array（）; deptlist = deptlist.split（）; i = 0; i <deptlist.length; i ++）{if（deptlist [i]！= ""）{var dept = deptlist [i] .split（ '、'）; var opt = document.createelement（ "option"）; opt.innerhtml = dept [1]; opt.value = dept [0]; ddluserschool.insertbefore（opt、ddluserschool.firstchild）;}}}}}}