자바의 모달 대화 상자에 div 내용 표시

모달 대화 상자 안에 이미지를 표시하려고하지만 이미지가 표시되지 않습니다. 누군가 이것에 대해 어떤 생각을 가질 수 있습니까? 여기 내 완벽한 HTML 레이아웃입니다. 참고 : div 콘텐츠에는 jquery가 있습니다.자바의 모달 대화 상자에 div 내용 표시

html_content = " 
    <strong>"+title+"</strong> 
    <br> 
    <br> 
    <img src='"+single_image+"'width='300' height='211'> 
    <br> "+content+" 
    <br>"+str+" 
    <div id='image'></div> 
    <div id='dialog-modal' title='Basic modal dialog'> 
    <div id='popup' style='display:none'>"+" 
     <a id='popup-close' href='' class='button'>"+"Fermer"+"</a> 
     <p><img id='image-placeholder' width='300px'; height='250px' src=''> 
     <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.js'></script> 
     <script type='text/javascript'> 
      $(document).ready(function() { 
       $('.popup-open').click(function(e){ 
        $('#popup:visible').hide(); 
        e.preventDefault(); 
        $('#image-placeholder').attr('src', $(this).attr('href')); 
        $('#popup').fadeIn('fast'); 
       }); 
       $('#popup-close').click(function(e){ 
        e.preventDefault(); 
        $('#popup').fadeOut('fast'); 
       }); 
      }); 
     </script> 
    "; 

String mdialog = " 
    <link rel=\"stylesheet\" href=\"http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css\" /> 
    <script src=\"http://code.jquery.com/jquery-1.8.2.js\"></script> 
    <script src=\"/resources/demos/external/jquery.bgiframe-2.1.2.js\"></script> 
    <script src=\"http://code.jquery.com/ui/1.9.1/jquery-ui.js\"></script> 
    <link rel=\"stylesheet\" href=\"/resources/demos/style.css\" /> 
    <script> 
     $(function() { 
      $('#dialog-modal').dialog({height: 140, modal: true}); 
     }); 
    </script> 
    <meta http-equiv=\"Content-Type\" " +"content=\"text/html; charset=utf-8\"> 
    <style> 
     #popup{border: 1px solid gray; background-color:black; border-radius: 5px 5px 5px 5px; margin-left:auto; margin-right:auto; position:fixed; top:50px; z-index: 9999;} 
    </style> 
    "; 

String webData = " 
    <!DOCTYPE html> 
    <head> 
     "+mdialog+" 
    </head> 
     <body> 
     "+html_content+" 
       </tr> 
      </table> 
     </div> 
     </body> 
    </html> 
    ";

출처

2012-11-22 PIONA

Java! = JavaScript –

이 HTML 파일을 Android webview에로드하려고합니다. 안드로이드 자바 기반의 이유는 내가 자바에 게시 – PIONA

참조하십시오 .load() jquery 함수 –

코드를 다시 포맷했지만 정상적인 방식으로 코딩하지 않은 것이 분명합니다. FrontPage, Expression Web, Sharepoint 등과 같은 웹 개발 응용 프로그램을 사용하고 있습니까?

PHP를 통해 HTML을 주입하는 경우 그 이유를 언급해야합니다. 또한 불필요한 문자열 결합을 방지해야합니다. 단순히 다양한 문자열 비트에 모두 참여하고 조금 들여 쓰기 만하면 코드를 읽을 수있는 것으로 바꿨습니다. 코드에서
닫는 표 요소 (</tr></table>)하지만 다른 테이블 요소 - - 자바 스크립트
의 두 분리 된 영역 - 두의 jQuery document.ready 함수

을 <p> </p>
을 닫지 않고 -
이 나를 찾을 수

개발 환경을 알려주십시오. 가능한 경우 메모장 + +를 사용하여 모든 것을 손으로 코딩 할 것을 강력하게 제안합니다. 가장 많이 배우게 될 것입니다 (실제로 더 이상 어렵지 않습니다). 물론, 당신이 다른 방법을 사용하는 좋은 이유가 없다면 - 그래서 나는 묻습니다.

또한 jQueryUI 웹 사이트에 가서 their dialog examples을 직접 시도하는 것이 좋습니다. 그냥 잘라내거나 메모장 ++에 붙여 넣은 다음 모두 사용해보십시오. 그런 다음 다른 대화 상자 예제를 찾아 SO를 시도하십시오.

왜 메모장 ++인가? 구문 강조와 (가장 좋은 점은) 통합 FTP 구성 요소가 있기 때문입니다. 즉, 작업중인 스크립트 파일을 저장하면 즉시 웹 서버에 업로드되어 거의 즉각적인 라이브 테스트를 수행 할 수 있습니다. 환상적이야.

또한 phpacademy.org에서 훌륭한 코딩 리소스를 확인하실 수 있습니다. 확실히 웹상에서 최고의 tuts.

프로젝트에 대한 행운을 빕니다.

마지막으로 PHP 문자열에서 스크립트 코드를 가져올 때 코드가 실제로 보이고 스크립트 섹션이 결합되어 스타일 섹션의 서식이 지정됩니다. 아무데도없는 여분의 표 태그와 고아 단락 태그를 주목하십시오.

<!DOCTYPE html> 
<head> 
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css" /> 
    <script src="http://code.jquery.com/jquery-1.8.2.js"></script> 
    <script src="/resources/demos/external/jquery.bgiframe-2.1.2.js"></script> 
    <script src="http://code.jquery.com/ui/1.9.1/jquery-ui.js"></script> 
    <link rel="stylesheet" href="/resources/demos/style.css" /> 
    <script> 
     $(document).ready(function() { 
      $('#dialog-modal').dialog({height: 140, modal: true}); 
      $('.popup-open').click(function(e){ 
       $('#popup:visible').hide(); 
       e.preventDefault(); 
       $('#image-placeholder').attr('src', $(this).attr('href')); 
       $('#popup').fadeIn('fast'); 
      }); 
      $('#popup-close').click(function(e){ 
       e.preventDefault(); 
       $('#popup').fadeOut('fast'); 
      }); 
     }); 
    </script> 
    <meta http-equiv="Content-Type" " +"content="text/html; charset=utf-8"> 
    <style> 
     #popup{ 
      border: 1px solid gray; 
      background-color:black; 
      border-radius: 5px 5px 5px 5px; 
      margin-left:auto; 
      margin-right:auto; 
      position:fixed; 
      top:50px; 
      z-index: 9999; 
      } 
    </style> 
</head> 
<body> 
    <strong>This is my Title</strong> 
    <br> 
    <br> 
    <img src='http://www.gravatar.com/avatar/783e6dfea0dcf458037183bdb333918d?s=32&d=identicon&r=PG'width='300' height='211'> 
    <br> 
     Here is some content 
    <br> 
     Here is a string of text. 
    <div id='image'></div> 
    <div id='dialog-modal' title='Basic modal dialog'> 
    <div id='popup' style='display:none'> 
     <a id='popup-close' href='' class='button'>Fermer</a> 
     <p><img id='image-placeholder' width='300px'; height='250px' src=''> 
     <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.js'></script> 
     <script type='text/javascript'> 
     </script> 
     </tr> 
      </table> 
     </div> 
    </body> 
</html>

출처

2012-11-22 19:29:17 gibberish

감사합니다. 이 html은 자바 환경에서 사용될 것입니다. 이미지를 클릭 할 때 모달 대화 상자를 표시 할 수 있습니까? – PIONA

및 모달 대화 상자가 표시되지 않습니다. – PIONA

자바의 모달 대화 상자에 div 내용 표시

답변

관련 문제