Récemment, le projet implique une petite fonctionnalité. / Pinyin, entrez automatiquement les demandes de brouillard de la base de données et renvoyez le résultat correspondant pour générer un datalist. plus pratique. Le code avant est le suivant:
Code html:
<! Equiv = x-ua-compatible> <meta name = viceport contenu = width = device-width, initial-scale = 1.0> <meta name = Description Content => <meta name = auteur contenu => <script src = ../ . Vascript> </ script> <script src = .././common/js/js/ajaxjson.js type = text / javascript> </ script> <script src = ../common/js/setting.js type = Text / javascript> </ script> <script src = ../common/js/paging.js type = text / javascript> </ script> <script src = ../../warehousemanage / testy .js type = text / Javascript> </ script> </ head> <body class => <! - <! class = contenu> <div class = header> <h1 id = adu class = page-title> Test de boîte déroulante </h1> </div> <div class = Container-fluid> <div classs = row-fluid> <! - -------------------------- 多条件查询 ------------ ----- -------------------------------------> <div class = well id = searchdemo> <p> Test data (The default is D00001): <br> Kunshan Mainland Accessories Co., Ltd. KSDLPJYXGS <br> Yizhen Enterprise Co., Ltd. YZQYYXGS <br> Taizhou Anxiang Bearing Skin Factory (Group Factory) TZSATZPC (JTC) </ p> </div> correspondance dynamique selon le nom du fournisseur (chinois ou pinyin peut être disponible): <entrée list = bro id = name onInput = this.value = this.value.replace (/ ^ + | + $ / g , ''); Search ('name', 'bro', 'name')> <datalist id = bro> </ dataalist> --------------------------------- ----------------- Pied à pied -------------------------- -> <Footer Class = Foot> </ Footer> </html>Code javascript:
Var listObj = null; I nput tag id * datalistid: id * itemname des tags de données: la valeur clé requise dans les données json renvoyées en arrière ) {input) contenu = document .getElementyId (inputId); childNodes; if (sub.length> 0) {pour (var i = sub.length-1; i> = 0; i-) {datalist.reMoveChild (sub [i]);} listObj = null; InputContent.Value = Null; Retour False;} // Variables globales ListOBJ = Datalist; // 检测出是拼音首字母 data = type = searchwords¶m = + inputContent.value; / Remarque: URL ---------------------------------------------- -------------------------------------------------- --------------------------------------- Besoin de personnaliser SendRequest (message, URL, données, getResult);} else if (/ ^ [/ u4e00 - // u4e00- / u9fa5] * $ /. test (inputContent.value)) {// 检测出是中文 data = type = searchchinese¶m = + inputContent.value ; POST, URL, DONNÉES, GETRESSURS);}} // 填写仓库下拉框 Fonction GetResult (Result) {Var Data = Result; garantit seulement 10 if (jdata.length <= 10) {maxLength = jdata.length;} var sub = listObj.childNodes; (Sub [i]); Effacer la valeur de la boîte d'entrée dans la zone d'entrée;} pour (var i = 0; i <maxLength; i ++) {var obj = document.CreateElement (option); ^ [a-za-z] * $ /. Allue)) {obj.value = indexoBj [requestItem];} listObj.AppendChild (obj);} var subfix = document.CreateElement (option); ;Ce qui précède est la correspondance dynamique du nouveau datalist de l'étiquette HTML5 pour implémenter la boîte d'entrée et les données de la base de données d'arrière-plan. dans le temps. Merci beaucoup pour votre soutien pour le site Web VEVB Wulin!