javascript - 如何使用jquery仅显示div中包含一些数据的标签？

Question

我正在使用 Spring Controller 和 JSP 项目。我有一个 jsp 页面，其中有一个按钮，即 Process，一旦我单击该按钮，它就会在其下方显示两个单选按钮和一个 Submit 按钮.

点击提交按钮后，如果一切顺利，那么我会这样显示 -

Success= true 
Error= none
Data= some_data

但是正如您在我的 jsfiddle 中看到的那样。当我点击 jsp url 后加载表单时，它在浏览器上的显示如下 -

Process

Success= 
Error= 
Data=

意思是，它的顶部有 Process 按钮，就在 Success 、 Error 和 Data 标签下方其中没有值，因为我们尚未从 Controller 传递任何值。但对于用户来说，这看起来很奇怪。

所以我所做的是，一旦单击“处理”按钮 - 我根本不显示 Success、Error 和 Data 标签。仅在单击提交按钮后才显示它，并根据从 Controller 传递的内容在 Success 、 Error 和 Data 中提供相应的值.

所以这是jsfiddle这对我有用。这意味着每当单击提交按钮并且其中包含一些数据时我只会看到这些标签

现在我想做的是，如果按下提交按钮后标签 Data 的值为 null 或为空，那么我不想显示 Data > 标签，但如果 Success 和 Error 标签有一些数据，那么我会显示它们。如果可能的话我该如何做到这一点？

Answer 1

我相信.hide()在jquery中不支持<label>的隐藏。所以我建议使用 <span>标签为您的标签，而不是 <label>标签

<span id="status">Success= ${SUCCESS}</span>

然后在你的javascript中，使用.hide()和.show() ，类似于下面的内容:

$(document).ready(function() {

 //hide label
$('#status').hide();
$('#error').hide();
$('#data').hide();

$('.btn-primary').click(function () {
    $('.btn-primary').removeClass('currentButton')
    $(this).addClass('currentButton')
    $('form').hide()
    $("#form_" + $(this).attr('id')).show();
})

$('#submit').click(function(){

    $('#status').show();
    $('#error').show();
    $('#data').show();

});

})

an updated close enough demo