asp.net 웹 프로젝트의 JQuery 대화 상자

그래서 사용자가 웹 페이지 관련 정보를 표시하는 About 버튼과 같은 내 페이지의 메뉴 버튼을 클릭 할 때 팝업 대화 상자를 구현하려고합니다. 그래서, 위의 jquery 함수와 ascx 페이지를 구현했습니다.asp.net 웹 프로젝트의 JQuery 대화 상자

$(document).ready(function() { 
    $('#aboutButton').click(function(event) { 
     alert("Thanks for visiting!");//testing 
     $(function() { 
     $("#aboutButtonDiv").load('aboutButton.ascx'); 
     $("#aboutButtonDiv").dialog({ 
      backdrop: 'static', 
      draggable: false, 
      position: { 
       my: "center top", 
       at: "center top+100", 
       of: window 
      }, 
      dialogClass: "no-close",    
      resizable: false, 
      height: 'auto', 
      width: 500, 
      modal: true, 
      buttons: { 
       "OK": function() { 
       $(this).dialog("close"); 
       } 
      } 
      }) 
     }) 
    }) 
    $(".menu-close").hide(); 
});

내 ASCX 코드는 간단한 div 태그를이다

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="aboutButton.ascx.cs" Inherits="WebProj.aboutButton" %> 
<!DOCTYPE html> 
<html> 
<body> 
    <div id="aboutButtonDiv" title="About"> 
     <p>Hello this is my first dialog using JQuery</p> 
    </div> 
</body>

내가 클릭 이벤트 (I 메시지를 방문에 대한 감사를 볼 수 있습니다) 발사 된 버튼 만 대화 상자를 클릭하고

내가 원하는 것은 팝업되지 않습니다. Jquery 코드에서 뭔가 빠져있다. 내 메인 웹 페이지에 다음 버튼이 있습니다.

<li class="menutab-list"> 
    <a href="#" type="link" id="aboutButton" data-toggle="modal" data-target="#modalAbout"> 
     <span class="listing-text">About</span> 
    </a> 
</li>

출처

2017-04-03 user3324848

테스트했을 때 코드가 올바르게 작동합니다. 그래서 아마도 jQuery UI 파일이나 그 일부가 누락 된 것과 관련이 있습니다.

대화 상자가 작동하려면 jQuery UI 라이브러리가 필요합니다. 그리고 그것이 있다고하더라도 그것이 특정 Dialog 부분을 빠뜨린 것일 수 있습니다.

http://jqueryui.com/download/으로 이동하여 필요한 옵션을 선택하거나 전체 패키지를 다운로드하십시오. jquery-ui.js의 세 번째 줄에 포함되어있는 부분을 확인할 수 있습니다.

그리고 대화 상자가 제대로 작동하는 데 필요한 아이콘 이미지가 다운로드 된 jquery CSS 파일도 있습니다.

출처

2017-04-03 17:24:54 VDWWD

다음 스크립트 태그가 있습니다. 아직도 작동하지 않습니다 – user3324848

'jquery-ui.css'도 추가 했습니까? – VDWWD

그리고 다른 웹 사이트에서 가져 오려면 스크립트 태그에'http : //'를 추가해야합니다. – VDWWD

asp.net 웹 프로젝트의 JQuery 대화 상자

답변

관련 문제