Question

所以我有这个图像，我按下它应该显示一个表格。我试图通过代码和警报工作做一些警报，但表单仍未显示。

Folders.php

<?php require_once('menu.php') ?>
    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script>
    <script type="text/javascript" src="hideShowForm.js"></script>

    <aside>
        <form method="post" class="basic-frm" id="newFolder">
            <label>
                <h1>New Folder</h1>
            </label>
            <label>
                <span>Title:</span>
                <input id="title" type="text" name="title"/>
            </label>
            <label>
                <span>Description</span>
                <input id="description" type="text" name="description"/>
            </label>
            <input id="submit" type="submit" name="submit" value="Submit" class="button"/>
        </form>
        <script type="javascript">

        </script>
        <h1>Welcome</h1>
        <img src="images/newFolder.svg" onmouseover="this.src='images/newFolderHover.svg'" onmouseout="this.src='images/newFolder.svg'" id="clicky">
        <p>New folder</p>
    </aside>
<?php require_once('footer.php') ?>

hideShowForm.js

$(document).ready(function(){
    $('#newFolder').dialog({
        autoOpen: false,
        buttons: [
            {
                text: "Cancel",
                click: function() {
                    $(this).dialog("close");
                }},
            {
                text: "Submit",
                click: function() {
                    $('#zFormer').submit();
                }}
        ]
    });
    $('#clicky').button().click(function() {
        $('#newFolder').dialog("Open")
        alert("test");
    });
});

所以我在这里做的是当页面加载时表单将自动隐藏（哪个工作正常）但是当我点击id为#clicky的图像时，表单不显示但是警告确实

我也没有在控制台中出错，我已经尝试过了。

Answer 1

请将Open更改为全部小写open：

$('#newFolder').dialog("Open")

应该是：

$('#newFolder').dialog("open")

还在页面的head部分包含jQuery UI CSS。

弹出窗体不起作用

1 个答案: