jQuery를-UI 대화 상자가 제출 버튼</p> <p>HTML을 클릭 할 때 표시되지 않습니다 클릭 이벤트

Question

내 jQuery를-UI 대화 상자에 표시되지 않습니다 대화 상자가 아니라 경고 상자를 보여 주지만 어딘가에서 실수를 했습니까? 또한 내 jQuery를 및 jQuery를 UI를 libs와 (같은 대화 상자 내 "접속"페이지에서 동일한을 가지고 있으며 그것은 작동하고) 작업

편집 :

내 libs가있다

<script src="/jquery-ui-1.12.1/external/jquery/jquery.js"></script> 
<script src="/jquery-ui-1.12.1/jquery-ui.min.js"></script> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 

Answer 1

HTML 구조에 존재하지 않는 div에 대화 상자 기능을 적용하고 javascript/jquery에서도 대화 상자 기능을 만들지 않습니다. 당신이 jQueryUI 사이트의 예에서 볼 수 있듯이 당신이 그것을

에 그 대화 상자를 호출 할 수 있도록

그래서 당신은 당신의 HTML 안에 그 ID를 가진 요소가 있어야합니다 https://jqueryui.com/dialog/

$(document).ready(function() { 
 

 
    $("#PDFdialog").dialog({ 
 
     width: 500, autoOpen: false, resizable: false, draggable: false, 
 
     modal: false, 
 
     title: "pdf", 
 
     buttons: [ 
 
     { 
 
      text: "Annuler", 
 
      click: function() { 
 
       $(this).dialog("close"); 
 
      } 
 
     }] 
 
    }); 
 

 
    $("#pdfsub").click(function(){ 
 
     $("#PDFdialog").dialog("open"); 
 

 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<link href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" rel="stylesheet"/> 
 
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 
 
<input id="pdfsub" type="button" name="pdfsub" value="PDF"> 
 
<div id="PDFdialog"> 
 
</div>

Answer 2

여기에 해결책이있다.

$(document).ready(function() { 
 

 
    $("#PDFdialog").dialog({ 
 
     width: 500, autoOpen: false, resizable: false, draggable: false, 
 
     modal: false, 
 
     title: "pdf", 
 
     buttons: [ 
 
     { 
 
      text: "Annuler", 
 
      click: function() { 
 
       $(this).dialog("close"); 
 
      } 
 
     }] 
 
    }); 
 

 
    $("#pdfsub").click(function(){ 
 
     $("#PDFdialog").dialog("open"); 
 
     alert("btn"); 
 
    }); 
 
});

<link href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" rel="stylesheet"/> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 
 
<input id="pdfsub" type="button" name="pdfsub" value="PDF"> 
 

 
<div id="PDFdialog"> 
 
</div>

희망이 도움이 될 것입니다.