JavaScript：readOnly属性未设置

Question

我尝试创建一个编辑链接，以便在单击它时以只读模式打开该行的详细信息。

链接在这里：

<c:set var="deletableBook" value="0"/>

<a href="" title="Edit Book Info" onClick='resetDateAndMakeReadOnly(${deletableBook}); return performAction(${item.bookId}, "bookEdit");'>Edit</a>

这是被调用的函数：

function resetDateAndMakeReadOnly(allEditable) {      
 var e22 = document.getElementById('book_Date');
 var e3 = document.getElementById('book_type');
 var e4 = document.getElementById('book_Number');
 if (allEditable){
     e22.readOnly=false;
     e3.disabled=false;
     e4.readOnly=false;
     alert("read and write");
 } else {
     e22.readOnly=true;
     e3.disabled=true;
     e4.readOnly=true;
     alert("readOnly new");
 }
 e22.value = "<c:out value='${params.book_Date}'/>";
 return false;    }

目前运行此方法时似乎没有任何变化。我已经确认它使它成为逻辑的正确部分，但事情仍然是可编辑的。

Answer 1

这是因为你使用空href链接来触发你的javascript函数，这将重新加载你的页面。在javascript:void(0);中使用href。

<a href="javascript:void(0);" title="Edit Book Info" onClick='resetDateAndMakeReadOnly(${deletableBook}); return performAction(${item.bookId}, "bookEdit");'>Edit</a>

Answer 2

属性deletableBook不是布尔值，并且不是您在javascript函数中期望的false。在操作中切换变量

session.put("allEditable", !(session.get("allEditable")==null?Boolean.FALSE:(Boolean)session.get("allEditable")));

然后用

$(document).ready(function(){
    resetDateAndMakeReadOnly(<s:property value="%{#session.allEditable}"/>);
});

重新加载页面时，将根据allEditable重置字段属性。但是这个

<s:a href="" title="Edit Book Info" onClick="resetDateAndMakeReadOnly(%{#session.allEditable});">Make readonly</s:a>

不会重新加载页面并保留allEditable会话属性中的值。该语法可能有点混淆IDE，但正确评估OGNL表达式并呈现类似

<a title="Edit Book Info" onClick="resetDateAndMakeReadOnly(false);">Make readonly</a>

没有href属性，这就是没有重新加载页面的原因。

还应该通过设置id属性来查找JSP中的元素。