새 탭에서 부트스트랩 모달 열기
오픈할 수 있는 방법이 있나요?bootstrap modal
클릭 후 새 탭으로 이동middle mouse button
(또는 클릭만 하면 됩니다)right mouse button
아이템과click
"새 탭에서 열기"
예상되는 동작:
사용자는 다음을 클릭하여 동일한 탭에서 모달 열기left mouse button
아이템으로또, 유저에게middle mouse button
새 탭에서 모달 열기.
비슷한 작업(아래 링크)은 할 수 있지만 다음 링크에서는 처리할 수 없습니다.modal
어떻게 해서든 새로운 탭으로 모달 전달이 가능합니까?
JSFiddle:http://jsfiddle.net/vqxf7zyk/1/
(Google로 리다이렉트하는 대신 탭에 새로운 모달(modal)이 있어야 합니다.)
솔루션(기준)@RohitSharma
답변) :
http://jsfiddle.net/vqxf7zyk/10/
쓸 수 있어요.정상적으로 동작하고 있습니다.
$(document).ready(function() {
$('.btn-info.btn-lg').mousedown(function(event) {
if (event.which == 2) {
event.preventDefault();
window.open(document.URL + '#myModal', '');
}
});
$(window).load(function() {
$(window.location.hash).modal("show");
});
});
function openModal() {
window.open(document.URL + '#myModal', '');
$(window.location.hash).modal("show");
}
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<!-- Trigger the modal with a button -->
<button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal" contextmenu="mymenu">Open Modal</button>
<!-- menu will work only in firefox -->
<menu type="context" id="mymenu">
<menuitem label="Open this modal in new tab" onclick="openModal()" icon="/images/refresh-icon.png"></menuitem>
</menu>
<!-- Modal -->
<div id="myModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Modal Header</h4>
</div>
<div class="modal-body">
<p>Some text in the modal.</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
사용하였습니다.ID
새 탭에서 URL을 열 때 추가할 모달의 이름을 지정합니다.그리고 같은 아이디를 얻었다.window.location.hash
모드를 엽니다.
콘텍스트 메뉴에서 새 탭에서 모달 열기 링크를 찾을 수 없어서 콘텍스트 메뉴를 수동으로 추가했습니다.이것은 파이어폭스에서만 동작합니다.자세한 내용은 w3schools.com 에서 보실 수 있습니다.
웹 사이트 브라우저와 호환되도록 하려면 사용자 정의 컨텍스트 메뉴를 사용할 수 있습니다.
현재 이 예는 모든 브라우저에서 미들클릭용으로 사용할 수 있으며 파이어폭스에서는 컨텍스트메뉴용으로만 사용할 수 있습니다.
언급URL : https://stackoverflow.com/questions/45008678/open-bootstrap-modal-in-new-tab
'sourcecode' 카테고리의 다른 글
온도 변수 때문에 프로그램이 느려집니까? (0) | 2022.07.27 |
---|---|
가져오기 요청에서 데이터를 추출하여 내보냅니다. (0) | 2022.07.27 |
여러 테이블 행을 반환하는 Vue 구성 요소 (0) | 2022.07.27 |
스프링: @Component vs @Bean (0) | 2022.07.27 |
Linux 커널:시스템 콜 후킹 예시 (0) | 2022.07.27 |