Question

我已经在客户的网站上添加了一个简单的jquery slideDown函数，但他们想通过javascript添加一些样式，这样对于任何禁用JS的人来说，他们仍然可以看到内容。

<script>
    $(".click").click(function () {
        $(".morecontent").slideToggle("slow");
    });
</script>

.morecontent当前设置为通过样式表显示：none，所以基本上我想在脚本中包含此样式而不是样式表

Answer 1

要使用jQuery设置CSS，请使用：

$(".morecontent").css("display", "none");

也可以使用display:none设置.hide()属性。 注意：您应该在文档准备就绪时调用此代码，即元素已经定义。要实现这一目标，请使用：

$(document).ready(function(){
    $(".morecontent").hide();
})

禁用JavaScript时，元素将可见（因为样式表中的display:none已被删除）。启用JavaScript后，脚本将隐藏.morecontent，以便可以将其滑入。

Answer 2

删除样式表中的display:none，并在页面加载时使用jQuery隐藏类morecontent：

<script>
    $(".morecontent").hide();
    $(".click").click(function () {
        $(".morecontent").slideToggle("slow");
    });
</script>

这可能会导致闪烁，因为加载页面时会隐藏元素。您可以通过将整个页面$('body').hide();隐藏在页面顶部并在底部再次显示来解决此问题。

Answer 3

使用此：

$('.morecontent').hide();

Answer 4

<script>
    $(".morecontent").css ( {display: "none" } );
    $(".click").click(function () {
        $(".morecontent").slideToggle("slow");
    });
</script>

使用Javascript为元素添加样式

4 个答案: