覆盖对话框的问题

Question

这是我的代码：

使用Javascript：

$(".add_option").click(function () {
    alert("!");
    $("#dialog-form").dialog("open");
});
$("#dialog-form").dialog({
    autoOpen: false,
    height: 250,
    width: 350,
    modal: true,
    buttons: {
    "Create": function () {
        $("#choose_info").append('<div class="large-4 medium-4 small-12 columns options">/
        <input id="checkbox' + checkbox_no + '" type="checkbox"></input><label id="check' + check_no + '">' + $("#option_name").val() + '</label>/
                </div>');
        checkbox_no++;
        check_no++;
        $(this).dialog("close");
    },
    Cancel: function () {
        $(this).dialog("close");
    }
},
close: function () {
    $(this).dialog("close");
}
});
});

这是我的HTML：

<div id="dialog-form" title="Add Option">
    <label for="option_name">Option Name</label>
    <input type="text" name="option_name" id="option_name">
</div>

<button class="tiny radius add_option">Add Option</button>

不知何故，div dialog-form没有被覆盖，即对话框无法打开。

Answer 1

我刚刚格式化了代码，并在结尾删除了额外的}) ..一切正常......

查看此演示... http://jsfiddle.net/G7xke/114/