{"id":3032,"date":"2023-11-14T15:02:33","date_gmt":"2023-11-14T07:02:33","guid":{"rendered":""},"modified":"2023-11-14T15:02:33","modified_gmt":"2023-11-14T07:02:33","slug":"jQuery UI Dialog","status":"publish","type":"post","link":"https:\/\/bianchenghao6.com\/3032.html","title":{"rendered":"jQuery UI Dialog"},"content":{"rendered":"
\n

jQuery UI Dialog<\/h1>\n<\/div>\n
\n Dialog\u7528\u4e8e\u5728HTML\u9875\u9762\u4e0a\u5f88\u597d\u5730\u5448\u73b0\u4fe1\u606f\u3002 jQuery UI Dialog\u65b9\u6cd5\u7528\u4e8e\u521b\u5efa\u4e00\u4e2a\u57fa\u672c\u7684\u5bf9\u8bdd\u6846\u7a97\u53e3\uff0c\u8be5\u7a97\u53e3\u4f4d\u4e8e\u89c6\u53e3\u4e2d\u5e76\u53d7\u9875\u9762\u5185\u5bb9\u7684\u4fdd\u62a4\u3002\u5b83\u5177\u6709\u6807\u9898\u680f\u548c\u5185\u5bb9\u533a\u57df\uff0c\u5e76\u4e14\u9ed8\u8ba4\u60c5\u51b5\u4e0b\u53ef\u4ee5\u4f7f\u7528\" x\"\u56fe\u6807\u8fdb\u884c\u79fb\u52a8\uff0c\u8c03\u6574\u5927\u5c0f\u548c\u5173\u95ed\u3002\n<\/div>\n
\n \u8bed\u6cd5<\/strong>:\n<\/div>\n
\n \u60a8\u53ef\u4ee5\u4ee5\u4e24\u79cd\u5f62\u5f0f\u4f7f\u7528\u5bf9\u8bdd\u6846()\u65b9\u6cd5:\n<\/div>\n
\n
 
$(selector, context).dialog (options)
<\/span><\/code><\/pre>\n<\/div>\n
\n
 $(selector, context).dialog (\"action\", [params])
<\/span><\/code><\/pre>\n<\/div>\n

\u7b2c\u4e00\u79cd\u65b9\u6cd5<\/h2>\n
\n
 
$(selector, context).dialog (options)
<\/span><\/code><\/pre>\n<\/div>\n
\n dialog(options)\u65b9\u6cd5\u6307\u5b9a\u60a8\u53ef\u4ee5\u4f7f\u7528\u5bf9\u8bdd\u6846\u5f62\u5f0f\u7684HTML\u5143\u7d20\u3002\u5728\u8fd9\u91cc\uff0coptions\u53c2\u6570\u662f\u4e00\u4e2a\u5bf9\u8c61\uff0c\u7528\u4e8e\u6307\u5b9a\u8be5\u7a97\u53e3\u7684\u5916\u89c2\u548c\u884c\u4e3a\u3002\n<\/div>\n
\n \u8bed\u6cd5<\/strong>:\n<\/div>\n
\n
 $(selector, context).dialog(options);
<\/span><\/code><\/pre>\n<\/div>\n
\n \u60a8\u53ef\u4ee5\u4e00\u6b21\u4f7f\u7528JavaScript\u5bf9\u8c61\u4f7f\u7528\u4e00\u4e2a\u6216\u591a\u4e2a\u9009\u9879\u3002\u5982\u679c\u6709\u591a\u4e2a\u9009\u9879\uff0c\u5219\u5fc5\u987b\u4f7f\u7528\u9017\u53f7\u5c06\u5b83\u4eec\u5206\u5f00\uff0c\u5982\u4e0b\u6240\u793a:\n<\/div>\n
\n
 $(selector, context).dialog({option1: value1, option2: value2..... });
<\/span><\/code><\/pre>\n<\/div>\n
\n \u4ee5\u4e0b\u662f\u53ef\u4e0e\u8be5\u65b9\u6cd5\u4e00\u8d77\u4f7f\u7528\u7684\u4e0d\u540c\u9009\u9879\u7684\u5217\u8868:\n<\/div>\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
\u9009\u9879<\/td>\n\u8bf4\u660e<\/td>\n<\/tr>\n
appendto<\/td>\n\u5982\u679c\u5c06\u6b64\u9009\u9879\u8bbe\u7f6e\u4e3afalse\uff0c\u5c06\u9632\u6b62\u5c06UI\u53ef\u62d6\u52a8\u7c7b\u6dfb\u52a0\u5230\u6240\u9009DOM\u5143\u7d20\u5217\u8868\u4e2d\u3002\u9ed8\u8ba4\u60c5\u51b5\u4e0b\uff0c\u5176\u503c\u4e3atrue\u3002 <\/td>\n<\/tr>\n
autoopen<\/td>\n\u5982\u679c\u5c06\u6b64\u9009\u9879\u8bbe\u7f6e\u4e3atrue\uff0c\u5219\u5728\u521b\u5efa\u65f6\u5c06\u6253\u5f00\u5bf9\u8bdd\u6846\u3002\u5982\u679c\u4e3afalse\uff0c\u5219\u5728\u8c03\u7528dialog('open')\u65f6\u5c06\u6253\u5f00\u5bf9\u8bdd\u6846\u3002\u9ed8\u8ba4\u60c5\u51b5\u4e0b\uff0c\u5176\u503c\u4e3atrue\u3002<\/td>\n<\/tr>\n
buttons<\/td>\n\u6b64\u9009\u9879\u5728\u5bf9\u8bdd\u6846\u4e2d\u6dfb\u52a0\u6309\u94ae\u3002\u8fd9\u4e9b\u5217\u4e3a\u5bf9\u8c61\uff0c\u6bcf\u4e2a\u5c5e\u6027\u90fd\u662f\u6309\u94ae\u4e0a\u7684\u6587\u672c\u3002\u8be5\u503c\u662f\u7528\u6237\u5355\u51fb\u6309\u94ae\u65f6\u8c03\u7528\u7684\u56de\u8c03\u51fd\u6570\u3002\u9ed8\u8ba4\u60c5\u51b5\u4e0b\uff0c\u5176\u503c\u4e3a{}\u3002<\/td>\n<\/tr>\n
closeonescape <\/td>\n\u9664\u975e\u60a8\u5c06\u6b64\u9009\u9879\u8bbe\u7f6e\u4e3afalse\uff0c\u5426\u5219\u5f53\u5bf9\u8bdd\u6846\u5177\u6709\u7126\u70b9\u65f6\u7528\u6237\u6309\u9000\u51fa\u952e\u65f6\uff0c\u8be5\u5bf9\u8bdd\u6846\u5c06\u5173\u95ed\u3002\u9ed8\u8ba4\u60c5\u51b5\u4e0b\uff0c\u5176\u503c\u4e3atrue\u3002<\/td>\n<\/tr>\n
closetext <\/td>\n\u6b64\u9009\u9879\u5305\u542b\u7528\u4e8e\u66ff\u6362\u5173\u95ed\u6309\u94ae\u7684\u9ed8\u8ba4\u5173\u95ed\u6587\u672c\u7684\u6587\u672c\u3002\u9ed8\u8ba4\u60c5\u51b5\u4e0b\uff0c\u5176\u503c\u4e3a\"\u5173\u95ed\"\u3002<\/td>\n<\/tr>\n
dialogclass<\/td>\n\u5982\u679c\u5c06\u6b64\u9009\u9879\u8bbe\u7f6e\u4e3afalse\uff0c\u5c06\u9632\u6b62\u5c06UI\u62d6\u52a8\u7c7b\u6dfb\u52a0\u5230\u6240\u9009dom\u5143\u7d20\u5217\u8868\u4e2d\u3002\u9ed8\u8ba4\u60c5\u51b5\u4e0b\uff0c\u5176\u503c\u4e3a\"\"\u3002<\/td>\n<\/tr>\n
draggable<\/td>\n\u5c06\u6b64\u9009\u9879\u8bbe\u7f6e\u4e3afalse\uff0c\u901a\u8fc7\u5355\u51fb\u5e76\u62d6\u52a8\u6807\u9898\u680f\u5c06\u53ef\u62d6\u52a8\u5bf9\u8bdd\u6846\u3002\u9ed8\u8ba4\u60c5\u51b5\u4e0b\uff0c\u5176\u503c\u4e3atrue\u3002<\/td>\n<\/tr>\n
height<\/td>\n\u6b64\u9009\u9879\u8bbe\u7f6e\u5bf9\u8bdd\u6846\u7684\u9ad8\u5ea6\u3002\u9ed8\u8ba4\u60c5\u51b5\u4e0b\uff0c\u5176\u503c\u4e3a\"\u81ea\u52a8\"\u3002<\/td>\n<\/tr>\n
hide<\/td>\n\u6b64\u9009\u9879\u7528\u4e8e\u8bbe\u7f6e\u5173\u95ed\u5bf9\u8bdd\u6846\u65f6\u8981\u4f7f\u7528\u7684\u6548\u679c\u3002\u9ed8\u8ba4\u60c5\u51b5\u4e0b\uff0c\u5176\u503c\u4e3anull\u3002<\/td>\n<\/tr>\n
maxheight<\/td>\n\u6b64\u9009\u9879\u8bbe\u7f6e\u5bf9\u8bdd\u6846\u7684\u6700\u5927\u9ad8\u5ea6(\u4ee5\u50cf\u7d20\u4e3a\u5355\u4f4d)\u3002\u9ed8\u8ba4\u60c5\u51b5\u4e0b\uff0c\u5176\u503c\u4e3afalse\u3002<\/td>\n<\/tr>\n
maxwidth <\/td>\n\u6b64\u9009\u9879\u8bbe\u7f6e\u5bf9\u8bdd\u6846\u53ef\u8c03\u6574\u5927\u5c0f\u7684\u6700\u5927\u5bbd\u5ea6(\u4ee5\u50cf\u7d20\u4e3a\u5355\u4f4d)\u3002\u9ed8\u8ba4\u60c5\u51b5\u4e0b\uff0c\u5176\u503c\u4e3afalse\u3002<\/td>\n<\/tr>\n
minheight<\/td>\n\u6b64\u9009\u9879\u662f\u5bf9\u8bdd\u6846\u53ef\u4ee5\u8c03\u6574\u5927\u5c0f\u7684\u6700\u5c0f\u9ad8\u5ea6(\u4ee5\u50cf\u7d20\u4e3a\u5355\u4f4d)\u3002\u9ed8\u8ba4\u60c5\u51b5\u4e0b\uff0c\u5176\u503c\u4e3a150\u3002<\/td>\n<\/tr>\n
minwidth<\/td>\n\u6b64\u9009\u9879\u662f\u5bf9\u8bdd\u6846\u53ef\u8c03\u6574\u5927\u5c0f\u7684\u6700\u5c0f\u5bbd\u5ea6(\u4ee5\u50cf\u7d20\u4e3a\u5355\u4f4d)\u3002\u9ed8\u8ba4\u60c5\u51b5\u4e0b\uff0c\u5176\u503c\u4e3a150\u3002<\/td>\n<\/tr>\n
modal <\/td>\n\u5982\u679c\u6b64\u9009\u9879\u8bbe\u7f6e\u4e3atrue\uff0c\u5219\u5bf9\u8bdd\u6846\u5c06\u5177\u6709\u6a21\u5f0f\u884c\u4e3a\uff1b\u9875\u9762\u4e0a\u7684\u5176\u4ed6\u9879\u76ee\u5c06\u88ab\u7981\u7528\uff0c\u5373\u65e0\u6cd5\u4e0e\u4e4b\u4ea4\u4e92\u3002\u6a21\u5f0f\u5bf9\u8bdd\u6846\u5728\u5bf9\u8bdd\u6846\u4e0b\u65b9\u4f46\u5728\u5176\u4ed6\u9875\u9762\u5143\u7d20\u4e0a\u65b9\u521b\u5efa\u4e00\u4e2a\u53e0\u52a0\u5c42\u3002\u9ed8\u8ba4\u60c5\u51b5\u4e0b\uff0c\u5176\u503c\u4e3afalse\u3002<\/td>\n<\/tr>\n
position<\/td>\n\u6b64\u9009\u9879\u6307\u5b9a\u5bf9\u8bdd\u6846\u7684\u521d\u59cb\u4f4d\u7f6e\u3002\u53ef\u4ee5\u662f\u9884\u5b9a\u4e49\u4f4d\u7f6e\u4e4b\u4e00: \u5c45\u4e2d(\u9ed8\u8ba4)\uff0c\u5de6\uff0c\u53f3\uff0c\u4e0a\u6216\u4e0b\u3002\u4e5f\u53ef\u4ee5\u662f2\u5143\u7d20\u6570\u7ec4\uff0c\u5176\u5de6\u503c\u548c\u9876\u90e8\u503c(\u4ee5\u50cf\u7d20\u4e3a\u5355\u4f4d)\u4e3a[left\uff0ctop]\uff0c\u6216\u6587\u672c\u4f4d\u7f6e\uff0c\u4f8b\u5982['right'\uff0c'top']\u3002\u9ed8\u8ba4\u60c5\u51b5\u4e0b\uff0c\u5176\u503c\u4e3a{my: \" center\"\uff0c\u4f4d\u4e8e: \" center\"\uff0cof: window}\u3002<\/td>\n<\/tr>\n
resizeable<\/td>\n\u6b64\u9009\u9879\u9664\u975e\u8bbe\u7f6e\u4e3afalse\uff0c\u5426\u5219\u5bf9\u8bdd\u6846\u5728\u5404\u4e2a\u65b9\u5411\u4e0a\u5747\u53ef\u8c03\u6574\u5927\u5c0f\u3002\u9ed8\u8ba4\u60c5\u51b5\u4e0b\uff0c\u5176\u503c\u4e3atrue\u3002<\/td>\n<\/tr>\n
show<\/td>\n\u6b64\u9009\u9879\u662f\u6253\u5f00\u5bf9\u8bdd\u6846\u65f6\u8981\u4f7f\u7528\u7684\u6548\u679c\u3002\u9ed8\u8ba4\u60c5\u51b5\u4e0b\uff0c\u5176\u503c\u4e3anull\u3002<\/td>\n<\/tr>\n
title<\/td>\n\u6b64\u9009\u9879\u6307\u5b9a\u8981\u663e\u793a\u5728\u5bf9\u8bdd\u6846\u6807\u9898\u680f\u4e2d\u7684\u6587\u672c\u3002\u9ed8\u8ba4\u60c5\u51b5\u4e0b\uff0c\u5176\u503c\u4e3anull\u3002<\/td>\n<\/tr>\n
width<\/td>\n\u6b64\u9009\u9879\u6307\u5b9a\u5bf9\u8bdd\u6846\u7684\u5bbd\u5ea6(\u4ee5\u50cf\u7d20\u4e3a\u5355\u4f4d)\u3002\u9ed8\u8ba4\u60c5\u51b5\u4e0b\uff0c\u5176\u503c\u4e3a300\u3002<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

jQuery UI\u5bf9\u8bdd\u6846\u793a\u4f8b1 <\/h2>\n
\n \u8ba9\u6211\u4eec\u4e3e\u4e00\u4e2a\u7b80\u5355\u7684\u793a\u4f8b\u6765\u6f14\u793a\u5bf9\u8bdd\u6846\u529f\u80fd\u7684\u7528\u6cd5\uff0c\u8be5\u529f\u80fd\u4e0d\u5c06\u4efb\u4f55\u53c2\u6570\u4f20\u9012\u7ed9dialog()\u65b9\u6cd5\u3002\n<\/div>\n
\n
 <!doctype html>
<html lang=\"en\">
   <head><\/span>
      <meta charset=\"utf-8\">
      <title><\/span>jQuery UI Dialog functionality<\/title><\/span>
      <link href=\"http:\/\/code.jquery.com\/ui\/1.10.4\/themes\/ui-lightness\/jquery-ui.css\" rel=\"stylesheet\">
      <script src=\"http:\/\/code.jquery.com\/jquery-1.10.2.js\"><\/script><\/span>
      <script src=\"http:\/\/code.jquery.com\/ui\/1.10.4\/jquery-ui.js\"><\/script><\/span>
      <!-- CSS -->
      <style><\/span>
         .ui-widget-header,.ui-state-default, ui-button{
            background:#b9cd6d;
            border: 1px solid #b9cd6d;
            color: #FFFFFF;
            font-weight: bold;
         }
      <\/style><\/span>
      <!-- Javascript -->
      <script><\/span>
         $(function() {
            $( \"#dialog-1\").dialog({
               autoOpen: false,
            });
            $( \"#opener\").click(function() {
               $( \"#dialog-1\").dialog( \"open\");
            });
         });
      <\/script><\/span>
   <\/head><\/span>
   <body><\/span>
      <!-- HTML -->
      <div id=\"dialog-1\" title=\"Movie Title:Psycho (1960)\">\"A boy's best friend is his mother.\" <\/div><\/span>
      <button id=\"opener\">Open Dialog<\/button><\/span>
   <\/body><\/span>
<\/html><\/span>
<\/span><\/code><\/pre>\n<\/div>\n

jQuery UI\u5bf9\u8bdd\u6846\u793a\u4f8b2 <\/h2>\n
\n \u6309\u94ae\uff0c\u6807\u9898\u548c\u4f4d\u7f6e\u7684\u4f7f\u7528: <\/strong>\n<\/div>\n
\n \u8ba9\u6211\u4eec\u4ee5\u4e00\u4e2a\u793a\u4f8b\u6765\u6f14\u793a\u5bf9\u8bdd\u6846\u5c0f\u90e8\u4ef6\u4e2d\u4e09\u4e2a\u9009\u9879\u6309\u94ae\uff0c\u6807\u9898\u548c\u4f4d\u7f6e\u7684\u7528\u6cd5\u3002\n<\/div>\n
\n
 <!doctype html>
<html lang=\"en\">
   <head><\/span>
      <meta charset=\"utf-8\">
      <title><\/span>jQuery UI Dialog functionality<\/title><\/span>
      <link href=\"http:\/\/code.jquery.com\/ui\/1.10.4\/themes\/ui-lightness\/jquery-ui.css\" rel=\"stylesheet\">
      <script src=\"http:\/\/code.jquery.com\/jquery-1.10.2.js\"><\/script><\/span>
      <script src=\"http:\/\/code.jquery.com\/ui\/1.10.4\/jquery-ui.js\"><\/script><\/span>
      <!-- CSS -->
      <style><\/span>
         .ui-widget-header,.ui-state-default, ui-button{
            background:lightgreen;
            border: 1px solid #b9cd6d;
            color: black;
            font-weight: bold;
         }
      <\/style><\/span>
      <!-- Javascript -->
      <script><\/span>
         $(function() {
            $( \"#dialog-2\").dialog({
               autoOpen: false,
               buttons: {
                  OK: function() {$(this).dialog(\"close\");}
               },
               title: \"Movie Title:Sholey\",
               position: {
                  my: \"left center\",
                  at: \"left center\"
               }
            });
            $( \"#opener-2\").click(function() {
               $( \"#dialog-2\").dialog( \"open\");
            });
         });
      <\/script><\/span>
   <\/head><\/span>
   <body><\/span>
      <!-- HTML -->
      <div id=\"dialog-2\" title=\"Dialog Title goes here...\">Are O Sambha:Kitna inaam rakhi hai re sarkar hum par.<\/div><\/span>
      <button id=\"opener-2\">Open Dialog<\/button><\/span>
   <\/body><\/span>
<\/html><\/span>
<\/span><\/code><\/pre>\n<\/div>\n

jQueryUI\u5bf9\u8bdd\u6846\u793a\u4f8b3 <\/h2>\n
\n \u9690\u85cf\uff0c\u663e\u793a\u548c\u9ad8\u5ea6\u7684\u4f7f\u7528: <\/strong>\n<\/div>\n
\n \u8ba9\u6211\u4eec\u4ee5\u4e00\u4e2a\u793a\u4f8b\u6765\u6f14\u793a\u7528\u6cd5\u8fd9\u4e9b\u9009\u9879\u4e2d\u7684\u9690\u85cf\uff0c\u663e\u793a\u548c\u9ad8\u5ea6\u3002\n<\/div>\n
\n
 
<!doctype html>
<html lang=\"en\">
   <head><\/span>
      <meta charset=\"utf-8\">
      <title><\/span>jQuery UI Dialog functionality<\/title><\/span>
      <link href=\"http:\/\/code.jquery.com\/ui\/1.10.4\/themes\/ui-lightness\/jquery-ui.css\" rel=\"stylesheet\">
      <script src=\"http:\/\/code.jquery.com\/jquery-1.10.2.js\"><\/script><\/span>
      <script src=\"http:\/\/code.jquery.com\/ui\/1.10.4\/jquery-ui.js\"><\/script><\/span>
      <!-- CSS -->
      <style><\/span>
         .ui-widget-header,.ui-state-default, ui-button{
            background: lightyellow;
            border: 1px solid #b9cd6d;
            color: black;
            font-weight: bold;
         }
      <\/style><\/span>
      <!-- Javascript -->
      <script><\/span>
         $(function() {
            $( \"#dialog-3\").dialog({
               autoOpen: false,
               hide: \"slide\",
               show : \"slide\",
               height: 200
            });
            $( \"#opener-3\").click(function() {
               $( \"#dialog-3\").dialog( \"open\");
            });
         });
      <\/script><\/span>
   <\/head><\/span>
   <body><\/span>
      <!-- HTML -->
      <div id=\"dialog-3\" title=\"This is a title.\">This is a dialog.<\/div><\/span>
      <button id=\"opener-3\">Open Dialog<\/button><\/span>
   <\/body><\/span>
<\/html><\/span>
<\/span><\/code><\/pre>\n<\/div>\n

\u7b2c\u4e8c\u79cd\u65b9\u6cd5<\/h2>\n
\n
 $(selector, context).dialog (\"action\", [params]):
<\/span><\/code><\/pre>\n<\/div>\n
\n dialog (\"action\", [params])\u65b9\u6cd5\u7528\u4e8e\u5728\u5bf9\u8bdd\u6846\u4e0a\u6267\u884c\u64cd\u4f5c\uff0c\u4f8b\u5982\u5173\u95ed\u5bf9\u8bdd\u6846\u3002\u8be5\u64cd\u4f5c\u5728\u7b2c\u4e00\u4e2a\u53c2\u6570\u4e2d\u6307\u5b9a\u4e3a\u5b57\u7b26\u4e32\uff0c\u5e76\u4e14\u53ef\u4ee5\u9009\u62e9\u4f7f\u7528\u4e00\u4e2a\u6216\u591a\u4e2a\u53c2\u6570(\u57fa\u4e8e\u7ed9\u5b9a\u64cd\u4f5c)\u4e00\u4e2a\u6216\u591a\u4e2a\u53c2\u6570\u3002\n<\/div>\n
\n \u8bed\u6cd5<\/strong>:\n<\/div>\n
\n
 $(selector, context).dialog (\"action\", [params]);
<\/span><\/code><\/pre>\n<\/div>\n
\n \u4ee5\u4e0b\u662f\u4e0e\u6b64\u65b9\u6cd5\u4e00\u8d77\u4f7f\u7528\u7684\u64cd\u4f5c\u7684\u5217\u8868:\n<\/div>\n\n\n\n\n\n\n\n\n\n\n\n\n\n
\u52a8\u4f5c <\/td>\n\u8bf4\u660e<\/td>\n<\/tr>\n
close()<\/td>\n\u6b64\u64cd\u4f5c\u7528\u4e8e\u5173\u95ed\u5bf9\u8bdd\u6846\u3002\u6b64\u65b9\u6cd5\u4e0d\u63a5\u53d7\u4efb\u4f55\u53c2\u6570\u3002<\/td>\n<\/tr>\n
destroy()<\/td>\n\u6b64\u64cd\u4f5c\u7528\u4e8e\u5b8c\u5168\u5220\u9664\u5bf9\u8bdd\u6846\u3002\u8fd9\u5c06\u4f7f\u5143\u7d20\u8fd4\u56de\u5176\u521d\u59cb\u72b6\u6001\u3002\u6b64\u65b9\u6cd5\u4e0d\u63a5\u53d7\u4efb\u4f55\u53c2\u6570\u3002<\/td>\n<\/tr>\n
isOpen()<\/td>\n\u6b64\u64cd\u4f5c\u7528\u4e8e\u68c0\u67e5\u5bf9\u8bdd\u6846\u662f\u5426\u6253\u5f00\u3002\u6b64\u65b9\u6cd5\u4e0d\u63a5\u53d7\u4efb\u4f55\u53c2\u6570\u3002<\/td>\n<\/tr>\n
moveToTop()<\/td>\n\u6b64\u64cd\u4f5c\u7528\u4e8e\u5c06\u4f4d\u7f6e\u5206\u914d\u7ed9\u76f8\u5e94\u5bf9\u8bdd\u6846\u7684\u524d\u666f(\u5728\u5176\u4ed6\u5bf9\u8bdd\u6846\u7684\u9876\u90e8)\u3002\u6b64\u65b9\u6cd5\u4e0d\u63a5\u53d7\u4efb\u4f55\u53c2\u6570\u3002<\/td>\n<\/tr>\n
open()<\/td>\n\u6b64\u64cd\u4f5c\u7528\u4e8e\u6253\u5f00\u5bf9\u8bdd\u6846\u3002\u6b64\u65b9\u6cd5\u4e0d\u63a5\u53d7\u4efb\u4f55\u53c2\u6570\u3002<\/td>\n<\/tr>\n
option(optionName)<\/td>\n\u6b64\u64cd\u4f5c\u83b7\u53d6\u5f53\u524d\u4e0e\u6307\u5b9a\u7684optionName\u5173\u8054\u7684\u503c\u3002\u5176\u4e2doptionName\u662f\u8981\u83b7\u53d6\u7684\u9009\u9879\u7684\u540d\u79f0\u3002<\/td>\n<\/tr>\n
option()<\/td>\n\u6b64\u64cd\u4f5c\u83b7\u53d6\u4e00\u4e2a\u5bf9\u8c61\uff0c\u8be5\u5bf9\u8c61\u5305\u542b\u8868\u793a\u5f53\u524d\u5bf9\u8bdd\u6846\u9009\u9879\u54c8\u5e0c\u7684\u952e\/\u503c\u5bf9\u3002\u6b64\u65b9\u6cd5\u4e0d\u63a5\u53d7\u4efb\u4f55\u53c2\u6570\u3002<\/td>\n<\/tr>\n
option(optionName\uff0cvalue)<\/td>\n\u6b64\u64cd\u4f5c\u8bbe\u7f6e\u4e0e\u6307\u5b9a\u7684optionName\u5173\u8054\u7684\u5bf9\u8bdd\u6846\u9009\u9879\u7684\u503c\u3002<\/td>\n<\/tr>\n
option(\u9009\u9879)<\/td>\n\u6b64\u64cd\u4f5c\u4e3a\u5bf9\u8bdd\u6846\u8bbe\u7f6e\u4e00\u4e2a\u6216\u591a\u4e2a\u9009\u9879\u3002<\/td>\n<\/tr>\n
widget()<\/td>\n\u6b64\u52a8\u4f5c\u7528\u4e8e\u8fd4\u56de\u5bf9\u8bdd\u6846\u7684\u5c0f\u90e8\u4ef6\u5143\u7d20\uff1b\u7528ui-dialog\u7c7b\u540d\u6ce8\u91ca\u7684\u5143\u7d20\u3002\u6b64\u65b9\u6cd5\u4e0d\u63a5\u53d7\u4efb\u4f55\u53c2\u6570\u3002<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

jQuery UI\u5bf9\u8bdd\u6846\u793a\u4f8b4 <\/h2>\n
\n \u8ba9\u6211\u4eec\u4ee5\u4e00\u4e2a\u7b80\u5355\u7684\u793a\u4f8b\u6765\u6f14\u793aisOpen()\uff0copen()\u548cclose()\u65b9\u6cd5\u7684\u7528\u6cd5\u3002\n<\/div>\n
\n
 
<!doctype html>
<html lang=\"en\">
   <head><\/span>
      <meta charset=\"utf-8\">
      <title><\/span>jQuery UI Dialog functionality<\/title><\/span>
      <link href=\"http:\/\/code.jquery.com\/ui\/1.10.4\/themes\/ui-lightness\/jquery-ui.css\" rel=\"stylesheet\">
      <script src=\"http:\/\/code.jquery.com\/jquery-1.10.2.js\"><\/script><\/span>
      <script src=\"http:\/\/code.jquery.com\/ui\/1.10.4\/jquery-ui.js\"><\/script><\/span>
      <!-- CSS -->
      <style><\/span>
         .ui-widget-header,.ui-state-default, ui-button{
            background:#b9cd6d;
            border: 1px solid #b9cd6d;
            color: #FFFFFF;
            font-weight: bold;
         }
      <\/style><\/span>
      <!-- Javascript -->
      <script type=\"text\/javascript\">
         $(function(){
            $(\"#toggle\").click(function() {

               ($(\"#dialog-5\").dialog(\"isOpen\") == false) ? $(\"#dialog-5\").dialog(\"open\") : $(\"#dialog-5\").dialog(\"close\") ;
            });
            $(\"#dialog-5\").dialog({autoOpen: false});
         });
      <\/script><\/span>
   <\/head><\/span>
   <body><\/span>
      <button id=\"toggle\">Toggle dialog!<\/button><\/span>
      <div id=\"dialog-5\" title=\"Dialog Title!\">
         Click on the Toggle button to open and cose this dialog box.
      <\/div><\/span>
   <\/body><\/span>
<\/html><\/span>
<\/span><\/code><\/pre>\n<\/div>\n","protected":false},"excerpt":{"rendered":"jQuery UI Dialogzh-cn","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[183],"tags":[],"class_list":["post-3032","post","type-post","status-publish","format-standard","hentry","category-jquery-ui-jc"],"_links":{"self":[{"href":"https:\/\/bianchenghao6.com\/wp-json\/wp\/v2\/posts\/3032"}],"collection":[{"href":"https:\/\/bianchenghao6.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/bianchenghao6.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/bianchenghao6.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/bianchenghao6.com\/wp-json\/wp\/v2\/comments?post=3032"}],"version-history":[{"count":0,"href":"https:\/\/bianchenghao6.com\/wp-json\/wp\/v2\/posts\/3032\/revisions"}],"wp:attachment":[{"href":"https:\/\/bianchenghao6.com\/wp-json\/wp\/v2\/media?parent=3032"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/bianchenghao6.com\/wp-json\/wp\/v2\/categories?post=3032"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/bianchenghao6.com\/wp-json\/wp\/v2\/tags?post=3032"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}