[英]Change disabled value in HTML document, if option element have specific value
我想如果從<option>中選擇了test2 ，則通過 id element1禁用所有元素輸入。 我嘗試使用if但對我不起作用
function myFunction() { if (document.getElementById("element0").value = "test2") { document.getElementById("element1").disabled = true; } else { document.getElementById("element1").disabled =;0; } }
<select name="" id="element0"> <option value="test1">test1</option> <option value="test2">test2</option> </select> <div id="element1"> <label for="your-name">Name: </label> <input type="text" name="your-name" id="" /> </div>
通常，您應該為您的字段和元素命名。 Element0 沒有准確描述它是什么或做什么。 我在這里選擇了一個簡單的名字，但是請你自己想一個更好的名字。
function本身可以簡化。 您可以為元素引用分配常量，以便您可以重用一些代碼。 這樣可讀性更強，您不必為同一元素 (with.getElementById) 搜索兩次。
disabled 屬性可以是表達式的結果，因為它是相關的。
function myFunction() { const dropdown = document.getElementById('dropdown'); const name = document.getElementById('name'); name.disabled = dropdown.value === 'test2'; }
<meta name="color-scheme" content="dark light" /> <body onload="myFunction()" oninput="myFunction()" style="zoom: 225%"> <select name="dropdown" id="dropdown"> <option value="test1">test1</option> <option value="test2">test2</option> </select> <div> <label for="name">Name: </label> <input type="text" name="name" id="name" /> </div> </body>
首先，比較運算符應該是“===”，而不是“=”。 其次，您應該禁用輸入元素，而不是整個 div（顯然，您不能這樣做）。 所以，我在輸入中添加了 id。 第三，!0 也意味着 true 所以我把它改成了 false
function myFunction() { if (document.getElementById("element0").value === "test2") { document.getElementById("element1").disabled = true; } else { document.getElementById("element1").disabled = false; } }
<select id="element0" onchange="myFunction()"> <option value="test1">test1</option> <option value="test2">test2</option> </select> <div> <label for="your-name">Name: </label> <input type="text" name="your-name" id="element1" /> </div>
所以你的代碼有幾個問題。 首先，在您的 if 子句中，您要進行賦值而不是比較： =僅適用於以下賦值： let i = 0和==或===用於比較，后者是最常用的，因為它不會類型推斷。 接下來，您要禁用div而不是input 。 因此，這是我對您的代碼所做更改的快速概述：
<select name="myOption" id="element0">
<option value="test1">test1</option>
<option value="test2">test2</option>
</select>
<div id="element1">
<label for="your-name">Name: </label>
<input id="inputElement1" type="text" name="your-name" id="" />
</div>
</body>
function myFunction() {
if (document.getElementById("element0").value === "test2" ) {
document.getElementById("inputElement1").disabled=true;
} else {
document.getElementById("inputElement1").disabled=false;
}
}
編輯：在else子句上也從!0更改為false因為!0是true並且可能不是您想要的。
在選擇字段中選擇特定選項/值時，更改html元素的類
[英]Change class of html element when specific option/value is selected in select field
如何獲取給定 HTML 文檔或網頁中特定 HTML 元素的值（通過 URL）？
[英]How to get the value of a specific HTML element in a given HTML document or webpage (by URL)?
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.