javascript - 根据spring mvc中jsp代码的条件调用innerHTML

Question

我正在尝试找到一种方法，让 document.getElementById("1").innerHTML 根据来自 jsp 代码的条件被触发。

例如我在jsp页面上有以下jsp代码，

<table border="1">
<c:forEach items="${elements}" var="element">
    <tr>
        <td>${element.elementNumber}<br /> ${element.isReserved}
        </td>
    </tr>
</c:forEach>
</table>

基于“element.isReserved”，我需要更改html中的元素(假设使用.innerHTML)。 html 中的元素如下所示。我有几个这样的元素。

            <div class="col-xs-2">
                <div class="o-btn">
                    <a id="1" onClick="myFunction(this);">1</a>
                </div>
                <div class="clearfix"></div>
            </div>

如上图，显示为值为“1”的按钮。我想根据条件将值更改为“X”。我可以直接用js做到这一点，

<script>
        function myFunction(elmnt) {}
        function isReserved() {
            return 'X';
        }
        document.getElementById("1").innerHTML = isReserved();
</script>

但我需要使其依赖于 spring 的输出或上面显示的 jsp 代码。我想要的输出是，当 element.isReserved() (在 jsp 代码内)计算结果为 true 时，按钮上显示的“1”将更改为“X”。由于我有多个按钮元素，因此我需要检查每个按钮 element.isReserved() 的计算结果是否为 true。

Answer 1

我能够让它发挥作用。我找到了这个article非常有帮助。

在理解(并接受现实)JSP 如何与 html 一起工作之后，我必须稍微重构我的程序。

从 spring mvc 中，我将变量添加到模型中，

model.addAttribute("element1", 1);

在jsp页面上我用javascript检查了变量，

if("${element1}" == 1) {
    document.getElementById("1").innerHTML = 'X';
    document.getElementById("1").style.color = 'red';
}

可能有更好的解决方案，但对于像我这样的新手来说，它效果很好!

article我上面提到的对于新手来说确实是一本很好且重要的读物。