2012-05-15 2 views
0

Я пытаюсь открыть всплывающее окно на своем экране, где я могу заблокировать экран останова, чтобы пользователь мог только выбрать что-то из моего всплывающего окна или отменить всплывающее окно. В основном мне нужно передать какое-то значение из формы jsp во всплывающее окно, которое я сделал, но мне также нужно заблокировать оставшийся экран, который я пока не могу сделать. Спасибо.Как открыть всплывающее окно с блокировкой экрана остатка в HTML?

Это, как я звоню JQuery

<a href="#" class="modalInput" rel="#prompt">Download</a> 

Это мой скрипт

<script> 
$(document).ready(function() { 
var triggers = $(".modalInput").overlay({ 
    mask: { 
     color: '#555555', 
     loadSpeed: 200, 
     opacity: 0.9 
}, 
closeOnClick: false 
}); 

var buttons = $("#yesno button").click(function(e) { 
    var yes = buttons.index(this) === 0; 
    triggers.eq(0).html("You clicked " + (yes ? "yes" : "no")); 
}); 

$("#prompt form").submit(function(e) { 
     triggers.eq(1).overlay().close(); 
     var input = $("input", this).val(); 
     triggers.eq(1).html(input); 
     return e.preventDefault(); 
    }); 
}); 
</script> 

Это моя форма

<font face=arial bgcolor=""><b><center> 
<form id="myForm" name="myForm" method="post" action="SentMail" onsubmit="return validateForm(this)"> 
<div class="modal" id="prompt" > 
<div id=""> 
        <table width="100%" border="0" cellspacing="0" cellpadding="5" align="center"> 
         <tr> 
         <td align="right" valign="middle">&nbsp;</td> 
         <td align="right" valign="middle"><span style="color:#F00">*</span> Mandotary Field</td> 
         </tr> 
         <tr> 
         <td width="28%" align="right" valign="middle"><strong>Name:</strong><span style="color:#F00">*</span></td> 
         <td width="72%" align="left" valign="middle"><label for="textfield"></label> 
          <div class="out-border"> 
          <input name="name" type="text" class="comm-text" id="name" style="width:250px" placeholder="Name"/></div></td> 
         </tr> 
         <tr> 
         <td align="right" valign="middle"><strong>Email:</strong><span style="color:#F00">*</span></td> 
         <td align="left" valign="middle"><label for="textfield2"></label> 
          <div class="out-border"> 
          <input name="Email" type="text" class="comm-text" id="Email" style="width:250px" placeholder="Email"/></div></td> 
         </tr> 
         <tr> 
         <td align="right" valign="middle"><strong>Contact No.:</strong></td> 
         <td align="left" valign="middle"><label for="textfield2"></label> 
          <div class="out-border"> 
          <input name="contact" type="text" class="comm-text" onkeypress="return isNumberKey(event)" maxlength="10" id="contact" style="width:250px" placeholder="Contact Number"/></div></td> 
         </tr> 

         <tr> 
         <td align="left" valign="middle">&nbsp;</td> 
         <td align="left" valign="middle"><input type="submit" name="signIn" value="Submit" class="button green"> </input> 
         <input type="button" name="signIn" value="Close" class="close"> </input></td> 
         </tr> 

        </table> 
        </div></div> 
    </form> 
</center></b></font> 
+0

Плохая идея, пользователь будет ненавидеть это и, возможно, покинуть ваш сайт – Undefined

+1

alert ('your text'); ;) – jimpic

+0

Что вы ищете - это модальное всплывающее окно – ManseUK

ответ

1

Вы можете посмотреть в jQuery UI - особенно Dialog и modal.

+0

Я использую jQuery, но он не позволяет отправлять значение с моей страницы jsp в этот диалог. –

+0

Тогда вы делаете что-то не так в разметке. JSP - это язык сервера и не должен влиять на вашу разметку JavaScript , так как это выполняется в браузере. –

+0

см. мой обновленный код. –

0

Я думаю, вы используете «window.open». Использовать window.showModalDialog

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