suchen

Heim >Web-Frontend >js-Tutorial >JS-Methode zum Implementieren der Dropdown-Menüzuweisung zu Textbox_Javascript-Fähigkeiten

JS-Methode zum Implementieren der Dropdown-Menüzuweisung zu Textbox_Javascript-Fähigkeiten

WBOY
WBOYOriginal
2016-05-16 15:44:381747Durchsuche

Das Beispiel in diesem Artikel beschreibt die Methode zum Zuweisen von Werten zum Textfeld aus dem Dropdown-Menü mithilfe von JS. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:

Hier ist eine Demonstration der Einführungsspalte, die aus dem Dropdown-Menü und dem Textfeld besteht. Der Wert im Feld „Auswählen“ wird im Eingabefeld „INPUT“ positioniert. Dies ist ein Beispiel für die Zuweisung des Werts des Dropdowns Es scheint eine häufige Funktion beim Surfen im Internet zu sein, aber ich weiß nicht, wie man es beschreiben könnte.

Der Betriebseffekt ist wie folgt:

Die Online-Demo-Adresse lautet wie folgt:

http://demo.jb51.net/js/2015/js-select-to-input-val-codes/

Der spezifische Code lautet wie folgt: 

<html>
<head>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin  
var messages = new Array(); 
messages[0] = ""; //这里写入每个选项对应的说明文字
messages[1] = "http://www.jb51.net";
messages[2] = "http://www.163.com";  
messages[3] = "http://cn.yahoo.com";
//根据需要，这里应该随着选项的改变而增减项目
function messageReveal() { 
var messageindex = document.messageForm.messagePick.selectedIndex;
//取得当前下拉菜单选定项目的序号
helpmsg = messages[messageindex];
//根据序号取得当前选项的说明
document.messageForm.messageField.value = helpmsg
//将说明写进文框
}
// End -->
</SCRIPT>
<title>下拉菜单和文本框构建的介绍栏</title>
</head>
<body>
<form name="messageForm">
<select name="messagePick" OnChange="messageReveal()">
<option value="0">请在这里选择需要咨询的信息
<option>脚本之家
<option>网易163
<option>中文雅虎
</select>
<br><br><br><br><br>
<input name="messageField" type="text" style="overflow:auto" />
</form>
</body>
</html>

Ich hoffe, dass dieser Artikel für das JavaScript-Programmierdesign aller hilfreich sein wird.

Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：Javascript implementiert die Javascript-Fähigkeiten zum Hochladen von Bildern auf der StartseiteNächster Artikel：Javascript implementiert die Javascript-Fähigkeiten zum Hochladen von Bildern auf der Startseite

In Verbindung stehende Artikel

Mehr sehen