Jquery toggleslide按钮

Question

我有红色框的div显示文字所在的地方＆＃34;你好世界＆＃34;，有jquery代码

$(document).ready(function () {
if ($('#box).contents().length == 0))
$('#box').hide();
else
$('#box').show();
    }
});

如果此框不为空，那么它将显示框，如果此红色框为空，则它将不会显示它。 这个jquery很棒。

现在我想在同一个框中添加toggleslider＆＃34; id =＆＃34; box＆＃34;，我使用了这个jquery代码..

$(document).ready(function(){
    $("#flip").click(function(){
        $("#box").slideToggle("slow");
    });
});

问题是因为第一个jquery代码崩溃而无法正常工作。 只有其中一种工作正常，不能同时进行。

唯一可行的方法是合并在一起，我喜欢的是加载页面时，如果红色框不为空，则显示红色框，如果为空则不显示框，同时有用户单击选项按钮可以向上和向下滑动该红色框。

请参阅jsfiddle

Answer 1

那里你有很多语法错误...... Fort示例看一下：{2, 8, 10, 11, 13}。 您没有关闭分隔符中的引号。它应该是： $('#box).contents().length。

这是一个工作小提琴：

$('#box').contents().length

$(document).ready(function () {
if ($('#box').contents().length == 0){
$('#box').hide();
} else {
$('#box').show();
}
});

$(document).ready(function(){
    $("#click").click(function(){
        $("#box").slideToggle("slow");
    });
});

#box{
		width:100%;
		height:100%;	
		background-color:red;
    color:white;
}

Answer 2

试试这段代码：

＆＃13;

＆＃13;

$(document).ready(function () {
    if($('#box').contents().length == 0){
        $('#box').hide();
    }else{
        $('#box').show();
    }
});

$(document).ready(function(){
    $("#click").click(function(){
        $("#box").slideToggle("slow");
    });
});

＆＃13;

#box{
    width:100%;
    height:100%;	
    background-color:red;
    color:white;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>



<div id="box">Hello World</div>
<div id="click">click me</div>

＆＃13;

＆＃13;

＆＃13;