javascript - 如何在 JavaScript 中使用 onblur 和 onchange

Question

如何在jsp文件中使用onblur和onchange我有一个带有表格的表单，其中包含多个单选框和选择框输入字段。本质上，我需要处理所有字段的 onchange 事件和某些字段的 onblur 事件。当对字段进行更改并且该字段失去焦点时，两个事件都会触发(这是正确的行为)。

实际上，我的预期输出是当我更改单选按钮时，选定的单选按钮选择框将启用，其他按钮将禁用。它将如何实现

<table class="table table-condensed table-striped table-bordered" style="width: 100%;">
    <thead style="height: 60px; overflow: auto;">
        <tr>
        <th style="text-align: center;color: teal;width: 5%;padding: 1%;"></th>
        <th style="text-align: center;color: teal;width: 5%;padding: 1%;">#</th>
        <th style="color: teal;width: 15%;text-align: center;padding: 1%;">Pedagogy</th>
        </tr>
    </thead>
    <tbody>
        <%
        int index = 0;
        for (Map<String, Object> eachLessonPlanDaily : lessonPlanDailys) 
        {
        %>
        <tr>
            <td style="text-align: center;width: 5%;">
            <%
            if(studentList.get(0).get("lessonPlanId") != null && studentList.get(0).get("lessonPlanId").equals(eachLessonPlanDaily.get("_id").toString())) {
            %>    
                <input type="radio" id="lessonPlanId" name="lessonPlanId" value="<%=eachLessonPlanDaily.get("_id").toString()%>" onblur="javascript:selectlpdblur(<%=index%>)" onchange="javascript:selectlpd(<%=index%>)" checked="checked">
            <%
            }
            else {
            %>       
                <input type="radio" id="lessonPlanId" name="lessonPlanId" value="<%=eachLessonPlanDaily.get("_id").toString()%>" onblur="javascript:selectlpdblur(<%=index%>)" onchange="javascript:selectlpd(<%=index%>)">
            <%
            }
            %>
            </td>
        <td style="text-align: center;width: 5%; "><%=index+1%></td>
        <td style="width: 15%;text-align: justify; ">
            <select name="pedagogylp" id="pedagogylp-<%=index%>" value="this.value" onchange="javascript:selectlpd(<%=index%>)" disabled="true">
                <option value="select">-------------select-------------</option>
                <%
                Iterator iterator = pedagogyList.entrySet().iterator();
                while (iterator.hasNext()) {
                    Map.Entry mapEntry = (Map.Entry) iterator.next();
                    if(eachLessonPlanDaily.get("pedagogy") != null && eachLessonPlanDaily.get("pedagogy").equals(mapEntry.getValue())){
                    %>
                        <option selected value="<%=mapEntry.getKey()%>"><%=mapEntry.getValue()%></option>
                    <%
                    }
                    else {
                    %>
                        <option value="<%=mapEntry.getKey()%>"><%=mapEntry.getValue()%></option>
                    <% 
                    }
                }
                %>
            </select>
        </td>
        </tr>
       <%
       index++;
                }
       %>
    </tbody>
</table>

这是我的 JavaScript 代码

function selectlpd(val) {
    alert("ok........."+val)
    document.getElementById("pedagogylpd").value = document.getElementById("pedagogylp-"+val).value;
    document.getElementById("pedagogylp-"+val).disabled=false;
}

function selectlpdblur(val) {
    alert("ok.blur........"+val)
    document.getElementById("toynamelp-"+val).disabled=true;
}

Answer 1

尝试从属性“onchange”和“onblur”中删除“javascript:”(http://www.w3schools.com/jsref/event_onblur.asp)。您的代码看起来没问题，否则请使用浏览器中的 F12 选项(开发人员控制台)进行调试。