Question

我试图创建.jsp，通过单击按钮，页面打开一个带有一些东西的模态对话框。我也在使用jQuery。我是新手，所以，为了测试jQuery是否正常工作，我首先尝试了一种＆＃34; Hello World＆＃34;像这样：

<h1 id="h01"></h1>

并且，在身体部分，刚开始时我有一个：

<script>
    function myFunction() {
        $("#h01").text("Hello jQuery");

        var diag;
        diag = $("#idNovoDialog").dialog({
            autoOpen: false,
            height: 300,
            width: 350,
            modal: true,
            buttons: {
                "Adicionar",
                "Cancelar",
            }
        });

        $("#idNovo").button().on( "click", function() {
            diag.dialog("open");
        });
    }

    $(document).ready(myFunction);
</script>

现在，如果我尝试在Netbeans上运行这个项目，那么＆＃34; Hello jQuery＆＃34;出现与预期一样。这意味着jQuery被认可得很好。

但是当我详细说明事情时，问题就开始了，试图按下按钮来打开模态对话框。我所做的功能变为：

<div id="idNovoDialog">
        Some stuff
    </div>

.jsp现在有：

<input type="button" value="NOVO" style="width:180px;" id="idNovo"/>

还有一个按钮：

db:
  image: postgres
web:
  build: .
  command: sh startup.sh
  volumes:
    - .:/code
  ports:
    - "8000:8000"
  links:
    - db

所以，如果我尝试运行它，它就好像脚本从未在那里开始。对话框部分不仅不起作用，而且是＆＃34; Hello jQuery＆＃34;部分也停止工作。既然它之前有用，我相信javascript代码中的某处出现了错误，但我真的找不到它。

有谁能说出我做错了什么？

Answer 1

问题是如何定义对话框选项的buttons：

        buttons: {
            "Adicionar",
            "Cancelar",
        }

根据JQuery UI文档，当您将其设置为对象时，键是按钮的名称，值是单击按钮时调用的函数。

        buttons: {
            "Adicionar": function() {
                // Action here
            },
            "Cancelar": function() {
                // Action here
            }
        }

工作JSFiddle：http://jsfiddle.net/ynr4b64g/ JQuery UI按钮文档：http://api.jqueryui.com/dialog/#option-buttons

Answer 2

稍微改变你的代码我能够让它正常工作..

$(document).ready(function () {
   $("#h01").text("Hello jQuery");
});

$(function () {
    $("#idNovoDialog").dialog({
        autoOpen: false,
        height: 300,
        width: 350,
        modal: true,
        buttons: {
            "Adicionar": function () {
                $(this).dialog("close");
            },
            "Cancelar": function () {
                $(this).dialog("close");
            }
        }
    });
});

$("#idNovo").on("click", function () {
    $("#idNovoDialog").dialog("open");
});

这里的工作示例：https://jsfiddle.net/fzrgtkdq/

JS脚本（貌似）在.jsp（Netbeans）中被忽略

2 个答案: