如何使用jquery只在div中显示包含一些数据的标签？ [英] How to show only the labels in a div which has some data in it using jquery?

问题描述

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

I am working with Spring Controller and JSP project. I have a jsp page in which I have one button which is Process and once I click that button, it shows me two radio button just below it and a Submit button as well.

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

And after clicking Submit button, if everything went fine, then I show like this -

Success= true 
Error= none
Data= some_data

但是你可以在我的 jsfiddle 。当我点击jsp url后加载我的表单时，它会在浏览器中显示 -

But as you can see in my jsfiddle. When my form gets loaded after I hit the jsp url it comes like this on the browser -

Process

Success= 
Error= 
Data=

意思是，它有处理按钮位于顶部成功，错误和数据标签中没有值，因为我们尚未从控制器传递任何值。但对于用户来说这看起来很奇怪。

Meaning, it has Process button at the top and just below Success , Error and Data label with no values in it as we haven't passed any values yet from the controller. But it looks pretty weird for the users.

所以我做的就是点击Process按钮 - 我不显示 Success ，错误和数据标签。只有在成功，错误和<$ c $中以适当的值单击提交按钮后，才会显示它c>数据取决于从控制器传递的内容。

So what I did is once I click Process button - I don't show Success, Error and Data labels at all. It should be shown only after the submit button is clicked with its appropriate value in Success , Error and Data depending on what is passed from the controller.

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

So this is the jsfiddle which is working for me. Meaning I only see these labels whenever submit button is clicked and it has some data in it

现在我要做的是，如果标签的值<$ c按下提交按钮后，$ c>数据为空或空，然后我不想显示数据标签，但如果成功和错误标签有一些数据，然后我会显示它们。如果可能，我该怎么办？

Now what I am trying to do is, if the value of label Data is null or empty after pressing the submit button, then I don't want to show Data label at all but if the Success and Error label has some data, then I would show them. How can I do this if this is possible?

推荐答案

我相信 .hide（）不支持< label> 的隐藏。因此，我建议您为标签使用< span> 标记，而不是< label> 标记

I believe that .hide() in jquery do not support the hide for <label>. So I would suggest to use <span> tag for your label instead the <label> tag

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

然后在 javascript 中，使用 .hide（）和 .show（），类似如下：

Then in your javascript, use .hide() and .show(), something similar as below:

$(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();

});

})

更新足够近的演示

这篇关于如何使用jquery只在div中显示包含一些数据的标签？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！