可拖动的 JQuery DIV 不起作用

draggable JQuery DIV don't work

本文关键字：DIV 不起作用 JQuery 拖动      更新时间：2023-09-26

我在使用一些 JQuery 代码时遇到了一些问题，当出现div 时，不采用可拖动属性。当用户只需按下按钮时，就会出现此div。div 上的另一个命令（例如隐藏和显示）工作正常，但可拖动...不

这是标签中的脚本代码：

<script type="text/javascript" src="System/Menu/interface.js"></script>
<script type="text/javascript" src="System/Menu/jquery.js"></script>
<script type="text/javascript" src="System/Menu/jquery.form.js"></script>
<script type="text/javascript">
$(document).ready(function () {
    //slide pannello start
    $(".btn-slide").click(function () {
        $("#startmenu").slideToggle("slow");
        $(this).toggleClass("active");
        return false;
    });
    $("#layer1").hide();
    $('#preferences').click(function () {
        $("#layer1").show();
        $('#layer1').Draggable();
    });
    $('#close').click(function () {
        $("#layer1").hide();
    });
});  
</script>

这是标签中的div：

<div id="layer1">
    <div id="layer1_handle">            
        <a href="#" id="close">[ x ]</a>
        Preferences
    </div>
    <div id="layer1_content">
        <form id="layer1_form" method="post" action="save_settings.php">
            Display Settings<br />
            <input type="radio" name="display" checked="checked" value="Default" />Default<br />
            <input type="radio" name="display" value="Option A" />Option A<br />
            <input type="radio" name="display" value="Option B" />Option B<br /><br />              
            Autosave settings<br />
            <input type="radio" name="autosave" checked="checked" value="Enabled" />Enabled<br />
            <input type="radio" name="autosave" value="Disabled" />Disabled<br /><br />
            <input type="submit" name="submit" value="Save" />
        </form>
    </div>
</div>

不知道为什么，但我认为是 whitout dubts 的代码错误，是我第一次使用 jquery 和可拖动的div。

感谢所有想帮助我:)

由于来源突出显示此错别字像拇指酸痛一样突出：

$('#layer1').draggable(); // should be lowercase

您还需要确保包含 jquery-ui 脚本：

<script src="http://code.jquery.com/ui/jquery-ui-git.js"></script>

我也没有看到任何具有首选项 ID 的 HTML。

<span id='preferences'>Preferences</span>

相关文章：