如何要求用户的下拉值不是“请选择”？答案

【问题标题】：How to require a user to have a dropdown value be something other than "Please Select"?如何要求用户的下拉值不是“请选择”？
【发布时间】：2016-07-08 10:16:16
【问题描述】：

在提交此 JSP 时，应要求用户选择“请选择”以外的其他内容。如果用户选择“请选择”并提交表单，它应该通过弹出窗口提醒用户他们应该更改字段。

<td class="normalTD" nowrap class="alignLeft" width="16%">
<form:select class="requiredAttr" path="detail[${loop.index}].cd" cssClass="fotnStyle" id="cd" >
<form:option value="">Please Select</form:option>
    <c:forEach var="list" items="${override.list}">
        <c:choose>
        <c:when test="${override.listne null}">
            <c:choose>
            <c:when test="${list.listCd eq detail.cd}">
                <c:set var="selectStatus" value="SELECTED" />
            </c:when>
            <c:otherwise>
                <c:set var="selectStatus" value="" />
            </c:otherwise>
            </c:choose>
        </c:when>
        </c:choose>
        <option value="${list.listCd}" ${selectStatus}>
        <c:out value="${list.desc}" />
        </option>
    </c:forEach>
</form:select>
</td>

我使用了以下 jQuery sn-p，它可以很好地提醒用户文本框未填充，但不影响下拉菜单。

function validate(){
    $(".requiredAttr").each(function(){
    if($(this).val().length < 1 || $(this).val() == ""){
        alert("Please fill in all the required fields.");
        $(this).focus();
        return false;

    }else{
        return true;
    }
    });
    return false;
}

这是生成的 HTML。

<td class="normalTD" nowrap class="alignLeft" width="16%">
<select id="cd" name="detail[0].cd" class="fotnStyle" class="requiredAttr">
    <option value="">Please Select</option>         
    <option value="1" >A</option>
    <option value="2" >B</option>                                               
    <option value="3" >C</option>                                                   
    <option value="4" >D</option>                                               
</select>
</td>

【问题讨论】：

生成的html是什么？
我将生成的 HTML 添加到我的帖子中。

标签： jquery jsp

【解决方案1】：

您的逻辑是正确的，但您不需要值的长度。对等于空的值进行简单检查就可以完成这项工作。

function validate()
{
    $(".requiredAttr").each(function(){
    if($.trim($(this).val()) == ""){
        alert("Please fill in all the required fields.");
        $(this).focus();
        return false;

    }else{
        return true;
    }
    });
    return false;
}

例如：https://jsfiddle.net/8p3ftmuh/3/

【讨论】：

【解决方案2】：

只需获取下拉列表的选定索引，如果为零则不选择任何值

if($("#cd").prop('selectedIndex') === 0) {
    alert(...);
}

或

if($("#cd")[0].selectedIndex === 0) {
    alert(...);
}