Ajax 请求未拉出 jQuery 对话框窗口

Ajax request not pulling up jQuery dialog window

本文关键字：jQuery 对话框窗口请求 Ajax 更新时间：2023-09-26

请查看此jsFiddle...

这是一个 jQuery UI 对话框，利用 ajax 请求来提取内容。我似乎无法弄清楚出了什么问题，但是除了空白对话框之外，什么都没有弹出。

.HTML。。。

<div id="#griffin"></div>
<ul>
    <li>
        <a href="ajax/ajax-bj.html" class="griffin-style all-about-bj" id="all-about-bj"></a>
    </li>
</ul>

哗啦��

$(function() {
    $("#griffin").dialog({
        autoOpen: true,
        modal: true,
        width: 950,
        height: 'auto',
        show: 'fade',
        hide: 'fade',
        position: {my: "center top", at:"center top", of: window },
        buttons: {
            "I have Read and Understand": function() {
                $(this).dialog("close");
            }
        }
    });
        $(".griffin-style").on("click", function(e) {
            e.preventDefault();
            $("#griffin").html("");
            $("#griffin").dialog("option", "title", "Loading...").dialog("open");
            $("#griffin").load(this.href, function() {
                $(this).dialog("option", "title", $(this).find("h1").text());
                $(this).find("h1").remove();
            });
        });
    });

思潮？

您必须在buttons参数下给出命令。

http://jsfiddle.net/aEwUF/4/

  $(function() {
    $( "#griffin" ).dialog({
      resizable: false,
      height:150,
      modal: true,
      buttons: {
        "I have read and understand the terms": function() {
          $( this ).dialog( "close" );
          $("p").html("You have accepted the terms");
          //write ajax requests in here..
        },
        Cancel: function() {
          $( this ).dialog( "close" );
        }
      }
    });
  });

需要添加一个jQuery UI对话框打开函数

http://api.jqueryui.com/dialog/#method-open

您必须在本地或在同一台服务器上运行它，因为JSFIDDLE由于同源策略而无法拉取您的外部文件

http://jsfiddle.net/aEwUF/7/

$(function() {
    $("#griffin").dialog({
        autoOpen: true,
        modal: true,
        width: 950,
        height: 'auto',
        show: 'fade',
        hide: 'fade',
        position: {my: "center top", at:"center top", of: window },
        buttons: {
            "I have Read and Understand": function() {
                $(this).dialog("close");
            }
        },
                    // add this
        open:function(event,ui){
                $("#griffin").html("");
                $("#griffin").load($(".griffin-style").attr("href"), function() {
                $("#griffin").dialog("option", "title", $(this).find("h1").text());
                $(".griffin-style").find("h1").remove();
            }); 
        }
    });

     $(".griffin-style").on("click", function(e) {
                e.preventDefault();
                $("#griffin").html("");
                $("#griffin").dialog("option", "title", "Loading...").dialog("open");
                $("#griffin").load(this.href, function() {
                    $("#griffin").dialog("option", "title", $(this).find("h1").text());
                    $(this).find("h1").remove();
                });
    }); 
 });