可拖动的JQuery DIV不起作用

时间:2013-11-04 18:19:50

标签: javascript jquery html jquery-ui draggable

我在使用某些JQuery代码时遇到一些问题,当div出现时,请不要使用draggable属性。当用户只需按下按钮时,就会出现此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>

Dunno为什么,但我认为是whitout dubts代码错误,这是我第一次使用jquery和可拖动的div。

感谢所有人想帮助我:)。

1 个答案:

答案 0 :(得分:1)

由于来源突出显示这个错字突然像拇指一样疼痛:

$('#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>