Добавление Jquery UI Dialog на кнопку

Я написал диалог Jqyery UI простой код тестирования, как это:Добавление Jquery UI Dialog на кнопку

<!DOCTYPE html> 
<html> 
<head lang="en"> 
    <meta charset="UTF-8"> 
    <title></title> 
    <link rel="stylesheet" type="text/css" href="topo.css"> 
    <link type="text/css" rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/smoothness/jquery-ui.css"/> 
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script> 
    <script> 
     plugin = { 
      mainPageRenderer: function() { 
       var plugin = this; 
       var addButton = $('<input id="addButton" class="addButton" type="submit" value="+">'); 
       addButton.click(plugin.addFU); 
       plugin.html = $('<div class="main-page"></div>'); 
       plugin.html.append(addButton); 

      }, 
      addFU:function(){ 
       $(this).dialog({ 
        buttons: [ 
         { 
          text: "OK", 
          click: function() { 
           $(this).dialog("close"); 
          } 
         } 
        ] 
       }); 
      }, 
      refresh: function() { 
       var plugin = this; 
       plugin.mainPageRenderer(); 
       $("body").append(plugin.html); 
      } 

     }; 

     $(document).ready(function() { 
      plugin.refresh(); 
     }); 
    </script> 
</head> 
<body>

Проблема заключается при нажатии на кнопку OK в JQuery UI диалоговое мой «+ msgstr "кнопка в исходной странице исчезает. Хо, я могу это предотвратить?

источник

2014-10-06 Govan

вы можете поделиться ссылкой jsfiddle? –

не удалось управлять jsfiddle, поэтому вместо этого я добавляю весь код. – Govan

Вы должны попробовать использовать

Javascript

<script type="text/javascript"> 
$(function(){ 
    var execute = function() { 
     alert('This is Ok button'); 
    } 
    var cancel = function() { 
     alert('This is Cancel button'); 
    } 
    var dialogOpts = { 
     buttons: { 
      "Ok": execute, 
      "Cancel": cancel 
     } 
    }; 
    $("#myDialog").dialog(dialogOpts); 
}); 
</script>

HTML

<input id="myDialog" class="addButton" type="submit" value="+">

ИЛИ

Javascript

$('#myDialog').dialog({ 
         // properties ... 
         buttons: [{ 
           id:"btn-accept", 
           text: "Accept", 
           click: function() { 
             $(this).dialog("close"); 
           } 
         },{ 
           id:"btn-cancel", 
           text: "Cancel", 
           click: function() { 
             $(this).dialog("close"); 
           } 
         }] 
       });

источник

2014-10-06 12:54:49 cracker

Добавление Jquery UI Dialog на кнопку

ответ

Смежные вопросы