【问题标题】:Thymeleaf multiple result in conditionThymeleaf 多重导致条件
【发布时间】:2018-07-11 02:44:55
【问题描述】:

我想根据语句'myStatus'检查一些条件,如果它是true - 将背景颜色更改为红色并禁用元素(用户无法单击它),如果是false - 将颜色更改为绿色.我知道如何改变颜色(而且效果很好):

th:style="${myObject.myStatus} == true ? 'background-color:red' : 'background-color:green'"

但是这行中的disable 元素怎么可能呢?我试过类似的东西:

th:style="${myObject.myStatus} == true ? 'background-color:red'  'disabled:false' : 'background-color:green'"

th:style="${myObject.myStatus} == true ? 'background-color:red'  'disabled' : 'background-color:green'"

th:style="${myObject.myStatus} == true ? 'background-color:red' & disable : 'background-color:green'"

但它不起作用......如何解决这个问题?

@更新

@RequestMapping(value = "/getObject/{someID}", method = RequestMethod.GET)
public String getAttr(@PathVariable(value="someID") String id, Model myObject){
    myObject.addAttribute("myObject", this.objectCreator.getObjects());
    return "/chosenobject";
}

它可以工作(因为颜色可以正常工作)。我在form 元素中使用它。

【问题讨论】:

    标签: javascript java html thymeleaf


    【解决方案1】:

    要禁用 HTML 元素,您必须使用 HTML 属性 disabled: https://www.w3schools.com/tags/att_disabled.asp。您可以使用 Thymeleaf 执行此操作,如下所示:

    th:disabled="${myObject.myStatus}" 
    

    假设myObject.myStatus 是布尔值的真或假

    要有条件地设置颜色,请执行以下操作:

    th:style="${myObject.myStatus} ? 'background-color:red' : 'background-color:green'"
    

    【讨论】:

    【解决方案2】:

    如果从控制器发送的条件评估为真(或假),您可以使用 Javascript 禁用元素。

    document.getElementById("id").disabled = true;
    

    您还可以使用pointer-events:none 在 CSS 中模拟 disabled 属性,如下所示:

    th:style="${myObject.myStatus} == true ? 'background-color:red;' : 'background-color:green; pointer-events: none;'"
    

    【讨论】:

      猜你喜欢
      相关资源
      最近更新 更多
      热门标签