禁用提交按鈕，直到選擇沒有 jquery 的下拉選項

Question

我有一個下拉 select 框，默認選項為“選擇一個”，查看報告提交按鈕

<select name="time" id="time" required>
 <option value="0" selected>Select one</option>
 <option value="1">Value 1</option>
 <option value="2">Value 2</option>
</select>
<input type="submit" name="act" value="View Report" disabled>

在選擇值 1 或 2 之前，提交按鈕處於禁用狀態。 在不使用 jquery 的情況下如何做到這一點？ 謝謝你。

Answer 1

如您所見，我將addEventListener添加到select ，因此當更改時腳本將檢查value是否不同於0

 const select = document.getElementById('time'); const submitButton = document.getElementById('submit'); document.getElementById('time').addEventListener('change', () => { if (select.value === '0') { submitButton.disabled = true; } else { submitButton.disabled = false; } });

 <select name="time" id="time" required> <option value="0" selected>Select one</option> <option value="1">Value 1</option> <option value="2">Value 2</option> </select> <input type="submit" name="act" id='submit' value="View Report" disabled>

Answer 2

您可以使用 .prop() 方法。 祝你好運！

<html>
  <head>
    <title>
    Bottom Nav Bar
    </title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <body>
    <select name="time" id="time" required>
     <option value="0" selected>Select one</option>
     <option value="1" >Value 1</option>
     <option value="2">Value 2</option>
    </select>
    <input type="submit" name="act" value="View Report" disabled>
    </body>
     <script>
    $("#time").click(function() {
             if($("select").val() == 0)
           $("input").prop( "disabled", true);
            else $("input").prop( "disabled", false);
        });
    </script>
    </html>

禁用提交按鈕，直到選擇沒有 jquery 的下拉選項

問題描述

2 個解決方案

解決方案1
3 已采納 2021-05-27 10:12:50

解決方案2
0 2021-05-27 10:54:02

禁用提交按鈕，直到選擇沒有 jquery 的下拉選項

問題描述

2 個解決方案

解決方案1 3 已采納 2021-05-27 10:12:50

解決方案2 0 2021-05-27 10:54:02

解決方案1
3 已采納 2021-05-27 10:12:50

解決方案2
0 2021-05-27 10:54:02