Question

我是jQuery和Javascript的新手，因此我正在测试它。我想通过单击按钮创建一个可拖动且可隐藏/可见的div容器。有人可以告诉我为什么我的按钮不工作？你能告诉我如何将div容器设置为标准隐形，这样我就可以点击显示按钮了吗？

CSS

#draggable { width: 150px; height: 150px; padding: 0.5em; }

HTML

<button id="hide">Hide</button>
<button id="show">Show</button>

<div id="draggable" class="ui-widget-content">
<p>Drag me around</p>
</div>

JS

$(function() {
$( "#draggable" ).draggable();
});

$(document).ready(function(){
    $("#hide").click(function(){
        $("draggable").hide();
    });
    $("#show").click(function(){
        $("draggable").show();
    });
});

在这里，您可以看到我当前运行的代码： http://jsfiddle.net/tdsdu1uq/2/

提前谢谢你。

Answer 1

你只是在jQuery选择器中犯了一个错误。您应该写下以下内容：

$("#hide").click(function(){
    $("#draggable").hide();
});
$("#show").click(function(){
    $("#draggable").show();
});

注意id的'＃'。您的更新JSFiddle是here。

干杯

Answer 2

更改$("draggable").hide();

到

$("#draggable").hide();

和$("draggable").show();

到

$("#draggable").show();

参见演示Here

DIV容器不可隐藏

2 个答案: