在 JavaScript 中使用 Onchange 建立下拉選單
在本文中,將詳細討論以下概念。
- JavaScript 中的函式是什麼?
- 什麼是
onchange
函式及其在 JavaScript 中的用途? - 使用 JavaScript 中的
onchange
函式建立一個下拉選單。
JavaScript 中的函式
在 JavaScript 中,函式是最基本的構建元件之一。函式類似於執行任務或計算值的過程。
儘管如此,一個程序必須接受一些輸入並提供一個帶有一些明顯連結的輸出才能成為一個函式,並且輸入和輸出之間必須存在關係。因此,在使用它之前,你必須在要呼叫的範圍內的某個位置宣告一個函式。
JavaScript 中的函式定義
它也被稱為函式宣告。函式定義遵循 function
關鍵字。
下面的示例顯示在函式宣告中啟動了 function
關鍵字。
函式宣告包含作為函式名稱的 function
關鍵字、函式引數列表(以逗號分隔並括在括號中)以及函式的 JavaScript 語句(包含在大括號 {...}
中)。
function square(x) {
return x * x;
}
square
函式只有一個引數 x
。該函式包含一行,宣告返回函式的引數 x
乘以自身。
返回的語句指定函式返回的值。
return x * x;
因為引數是按值有效地提供給函式的,所以如果函式體中的程式碼將不同的值分配給給函式的引數,則該更改不會全域性反映或反映在稱為函式
的程式碼中。
JavaScript 中的 onchange
函式
JavaScript 中的 onchange
事件是一個重要的事件,用於處理在事件執行期間發生的事件變化。當執行事件時值的狀態發生變化時,會完全觸發 onchange
事件。
onchange
事件與 oninput
事件非常相似,不同之處在於 oninput
事件會立即發生,並且值更改同樣相對較快。儘管如此,onchange
事件本質上是在事件的值失去其執行焦點時發生的。
object.onchange = function() {
BlocTAK
};
當焦點改變時,呼叫 onchange
函式的物件,然後執行 BlocTAK
來操作和修改值狀態或改變和轉換事件。
<html>
<body>
<p>Modify the text in the input field, then click outside the field to fire the onchange event.</p>
Enter something: <input onchange="myFunction(this.value)">
<script>
function myFunction(val) {
alert(" The new value is: " + val);
}
</script>
</body>
</html>
你可以在此連結中找到上述程式碼。下面使用示例 Hello World
附上上述程式碼的螢幕截圖。
在 JavaScript 中使用 onchange
函式建立下拉選單
這裡 onchange
函式用作事件偵聽器。
<select name="type" onmousedown="this.value='';" onchange="jsFunction(this.value);">
<option value='1 lac'>Toyota</option>
<option value='2 lac'>Kia</option>
<option value='3 lac'>Honda</option>
<option value='4 lac'>Suzuki</option>
<option value='5 lac'>Lamborghini</option>
</select>
這裡的 onchange
函式是用 jsFunction(this.value);
宣告的。
上述 HTML 程式碼的 JavaScript 外部檔案如下。
function jsFunction(value) {
alert(value);
}
你可以從此連結中看到上述程式碼中的 onchange
函式處理的工作。
因此,在上面的文章中,對函式以及如何在 JavaScript 中宣告它們進行了詳細的說明。然後詳細介紹了有關 onchange
函式的資訊、它的作用以及如何在 HTML 和 JavaScript 中宣告它。
然後在下拉選單中使用 onchange
功能,使下拉選單對使用者更方便。JavaScript 中的 onchange
函式至關重要,因為它允許使用者使用輸入更改然後驗證值,以交叉檢查所提供輸入的值轉換。
它與 JavaScript 中的 oninput
函式協同工作。