我必須在彈出窗口中打開html窗體。彈出窗口不應該是一個窗口（通常是使用window.open（）創建的），而應該像下面的鏈接中出現的一樣（在Firefox中打開） http://www.w3schools.com/js/tryit.asp?filename=tryjs_prompt 但這個代碼的問題是，我無法更改內容從「請輸入您的姓名」彈出到我的html表單中。 雖然搜索，我發現我們不能改變彈出提示框的內容，唯一的解決辦法是創建自己的彈出... 沒有更簡單的解決方案嗎？使用html/javascript/css彈出窗體
謝謝....
非常感謝.....這正是我想要的...... :) – 2011-06-08 08:38:03
@ Neetu歡迎您。請[接受答案然後]（http://meta.stackexchange.com/questions/5234/how-does-accepting-an-answer-work） – mplungjan 2011-06-08 09:12:05
但這裏又來了一個問題。實際上，我正在爲移動瀏覽器製作網站。我使用jquery彈出了使用jquery的筆記本電腦的工作方式（正如您所建議的那樣），但現在當我嘗試在android手機上進行測試時，該頁面未打開。我發佈了這個問題http://stackoverflow.com/questions/6292647/jquery-code-is-not-running-on-android-phone。你能幫我現在... – 2011-06-09 13:21:37
但這段代碼的問題是，我可以從「請輸入您的姓名」的內容彈出內容不會改變我的HTML表單。
嗯。只需更改傳遞給prompt()函數的字符串即可。
搜索時，我發現有我們不能改變彈出提示框
的你不能改變標題內容。您可以更改內容，它是傳遞給prompt()函數的第一個參數。
但提示並不需要HTML，只有文字 – mplungjan 2011-06-07 13:06:34
只需將「請輸入您的姓名」替換爲您所需的內容即可完成此工作。我錯過了什麼嗎？
聽起來像是你可能需要一個燈箱，既然你沒有標記包含使用jQuery你的問題是如何讓一個純粹的JS例子。
JS
var opener = document.getElementById("opener");
opener.onclick = function(){
var lightbox = document.getElementById("lightbox"),
dimmer = document.createElement("div");
dimmer.style.width = window.innerWidth + 'px';
dimmer.style.height = window.innerHeight + 'px';
dimmer.className = 'dimmer';
dimmer.onclick = function(){
document.body.removeChild(this);
lightbox.style.visibility = 'hidden';
}
document.body.appendChild(dimmer);
lightbox.style.visibility = 'visible';
lightbox.style.top = window.innerHeight/2 - 50 + 'px';
lightbox.style.left = window.innerWidth/2 - 100 + 'px';
return false;
}
標記
<div id="lightbox">Testing out the lightbox</div>
<a href="#" id="opener">Click me</a>
CSS
#lightbox{
visibility:hidden;
position:absolute;
background:red;
border:2px solid #3c3c3c;
color:white;
z-index:100;
width: 200px;
height:100px;
padding:20px;
}
.dimmer{
background: #000;
position: absolute;
opacity: .5;
top: 0;
z-index:99;
}
看最簡單的例子，以使用創建彈出CSS和JavaScript。
看到這個鏈接 http://makecodeeasy.blogspot.in/2012/07/popup-in-java-script-and-css.html
這裏完整的例子是一種資源，你可以編輯和使用 下載源代碼或在這裏觀看現場演示 http://purpledesign.in/blog/pop-out-a-form-using-jquery-and-javascript/
A DD按鈕或鏈接到您的網頁這樣
<p><a href="#inline">click to open</a></p>
「#inline」這裏應該是的「ID」將包含的形式。
<div id="inline">
<h2>Send us a Message</h2>
<form id="contact" name="contact" action="#" method="post">
<label for="email">Your E-mail</label>
<input type="email" id="email" name="email" class="txt">
<br>
<label for="msg">Enter a Message</label>
<textarea id="msg" name="msg" class="txtarea"></textarea>
<button id="send">Send E-mail</button>
</form>
</div>
包含這些腳本來監聽點擊事件。如果你已經在你的形式的操作定義，您可以使用「的preventDefault（）」方法
<script type="text/javascript">
$(document).ready(function() {
$(".modalbox").fancybox();
$("#contact").submit(function() { return false; });
$("#send").on("click", function(){
var emailval = $("#email").val();
var msgval = $("#msg").val();
var msglen = msgval.length;
var mailvalid = validateEmail(emailval);
if(mailvalid == false) {
$("#email").addClass("error");
}
else if(mailvalid == true){
$("#email").removeClass("error");
}
if(msglen < 4) {
$("#msg").addClass("error");
}
else if(msglen >= 4){
$("#msg").removeClass("error");
}
if(mailvalid == true && msglen >= 4) {
// if both validate we attempt to send the e-mail
// first we hide the submit btn so the user doesnt click twice
$("#send").replaceWith("<em>sending...</em>");
//This will post it to the php page
$.ajax({
type: 'POST',
url: 'sendmessage.php',
data: $("#contact").serialize(),
success: function(data) {
if(data == "true") {
$("#contact").fadeOut("fast", function(){
//Display a message on successful posting for 1 sec
$(this).before("<p><strong>Success! Your feedback has been sent, thanks :)</strong></p>");
setTimeout("$.fancybox.close()", 1000);
});
}
}
});
}
});
});
</script>
您可以添加你想要在你的PHP文件做任何事情。
Google「Javascript Modals」或「JQuery Modals」 – 2011-06-07 13:28:27
我相信「無法更改[popup]內容」評論指的是_redirect-preventing_upups。出於明顯的安全原因，該消息通常被瀏覽器覆蓋。下面是一個演示問題的小提琴：http://jsfiddle.net/k2fYM/ – 2014-01-27 11:51:48