如何仅在特定页面

时间:2018-02-05 16:05:27

标签: javascript jquery html css

我已经通过在styles.css文件中设置下面的CSS来禁用JQuery对话框中的关闭按钮([x]):

.ui-dialog-titlebar-close {
    display: none;
}

没关系,通常我不想让关闭按钮显示出来。但在某些特定情况下,我希望它出现,我想要做的是通过JS删除此CSS属性,使用以下命令:

$('.ui-dialog-titlebar-close').removeClass('display');

但由于某种原因,它无法正常工作。取回关闭按钮的唯一方法是从styles.css文件中删除CSS属性。

是否有任何解决方法不需要我编写另一个特定于我希望按钮出现的页面的CSS文件?

由于

3 个答案:

答案 0 :(得分:1)

removeClass用于删除类,而不是属性。您无法使用它删除css属性。您可以像这样更新jquery中的属性

$('.ui-dialog-titlebar-close').css("display":"block");

如果您要删除jquery中的属性,可以像这样删除

$('.ui-dialog-titlebar-close').css("display":"");

你可以在jquery中使用show()函数来显示icon

$('.ui-dialog-titlebar-close').show() 



$( "#close" ).click(function() {
  $('.ui-dialog-titlebar-close').show() 
});

.ui-dialog-titlebar-close{
display:none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="close">close</button>
<div class="ui-dialog-titlebar-close">Close Button Clicked</div>
&#13;
&#13;
&#13;

答案 1 :(得分:1)

您可以在希望它显示的页面上向正文添加一个类:

<body class="show-close">

在CSS文件中就是这样的:

.ui-dialog-titlebar-close {
    display: none;
}

.show-close .ui-dialog-titlebar-close {
    display: block;
}

答案 2 :(得分:1)

隐藏它:

$('.ui-dialog-titlebar-close').css("visibility","hidden"); 

要显示:

$('.ui-dialog-titlebar-close').css("visibility","visible");