Question

我创建了一个JSP，我有这样的形式：

    <form action="Cinema" method="get">
    <select name="IdRoom" id="selectBox">
        <option disabled="disabled" selected> Choose a Cinema </option>         
        <c:forEach items="${listCinema}" var="singleCinema">
            <option value="${singleCinema.idSingleCinema}">${singleCinema.localName}</option>
        </c:forEach>
    </select>
    <input id="buttonSubmit" type="submit" value="Submit" />
</form>

作为第一行（在for之前），我将值添加到此处：

<option disabled="disabled" selected> Choose a Cinema </option>

当页面上传时，如果我尝试点击按钮功能，它会拨打我的服务（它不应该），但在我打开下拉列表后，我的下拉列表的第一个值已正确禁用。当页面仅上传下拉列表的第一个值（而不是其他列表）时，我需要禁用“提交此选项”按钮

Answer 1

向onchange添加select侦听器，并将禁用的属性添加到提交按钮，如下所示：

<select name="IdRoom" id="selectBox" onchange="this.form.buttonSubmit.disabled=this.options[this.selectedIndex].value=='your-first-value'">

<input id="buttonSubmit" type="submit" value="Submit" disabled="disabled">

只要更改下拉列表的值，就会触发onchange。在这种情况下，每当您选择一个值时，它将检查所选值是否等于您的第一个值。如果是这种情况，则提交按钮的disabled属性设置为true，否则设置为false。

希望它有所帮助!!

Answer 2

$(document).ready( function() {
  $("select").on('change',function(){
     if($(this).find('option:selected').text() == "Choose a Cinema")
         $("#buttonSubmit").attr('disabled', true);
     else
         $("#buttonSubmit").attr('disabled', false);
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="Cinema" method="get">
    <select name="IdRoom" id="selectBox">
        <option disabled="disabled" selected> Choose a Cinema </option>         
        <c:forEach items="${listCinema}" var="singleCinema">
            <option value="${singleCinema.idSingleCinema}">${singleCinema.localName}</option>
        </c:forEach>
    </select>
    <input id="buttonSubmit" disabled="disabled" type="submit" value="Submit" />
</form>

禁用表单上的提交按钮以获取选项的特定值

2 个答案: