Javascript 如何在javascript中显示带有文本框和浏览按钮的弹出窗口？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10944636/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to show a popup with textbox and browse button in javascript?
提问by Saravanan
In my asp page, i want to show a popup window whenever user clicks the button.The popup window contains one text box and submit button for getting the filepath from the user.
在我的 asp 页面中，我想在用户单击按钮时显示一个弹出窗口。弹出窗口包含一个文本框和提交按钮，用于从用户那里获取文件路径。
for example : i want a popup like this in stackoverflow site...
例如：我想在 stackoverflow 站点中出现这样的弹出窗口...
Please hele me to get this...
请帮我拿这个...
回答by Priyank Patel
Here is a EDITED:demo.Customize it to suit your needs.Let me know if need further help. I have added a link which will display the popup on click. After that the popup div is the actual popup , the popup div contains another div , just to hold the contents , in this case textbox and buttons.Here is the Html part.
这是一个编辑：演示。自定义它以满足您的需求。如果需要进一步帮助，请告诉我。我添加了一个链接，该链接将在单击时显示弹出窗口。之后弹出 div 是实际的 popup ，弹出 div 包含另一个 div ，只是为了保存内容，在这种情况下是文本框和按钮。这是 Html 部分。
<a id="popuplink" href="#">Click Me</a>
<div id="popup">
<div id="content">
<input type="text"/><input type="Button" value="Browse..."/>
<input id="popupclose" type="Button" value="Close"/>
</div>
</div>?
Here is CSS:
这是CSS：
#popup
{
display:none;
position:fixed;
width:250px;
height: 150px;
top: 50%;
left: 50%;
margin-left:-155px;
margin-top:-110px;
border:5px solid red;
background-color:#DEDFDE;
padding:30px;
z-index:102;
font-family:Verdana;
font-size:10pt;
border-radius:10px;
-webkit-border-radius:20px;
-moz-border-radius:20px;
font-weight:bold;
}
#content
{
height:auto;
width:250px;
margin:60px auto;
}
#popupclose
{
margin:35px 0 0 80px;
width:50px;
}?
EDIT:To get the value of the textbox check This demo
编辑：要获取文本框的值，请检查此演示
To call the javascript function on click of Asp.Net Button , try doing something like this. Create a function which will show the popup.
要在单击 Asp.Net Button 时调用 javascript 函数，请尝试执行以下操作。创建一个将显示弹出窗口的函数。
function ShowPopUp()
{
$('#popup').show("slow");
}
And on button click try this,
然后点击按钮试试这个，
ClientScript.RegisterStartupScript(GetType(), "popup", "ShowPopUp()", true);
Additional InformationMSDN
附加信息MSDN
回答by Mike Sav
If I understand you correctly you want to use window.open, here's some info: https://developer.mozilla.org/en/DOM/window.open
如果我正确理解你想要使用window.open，这里有一些信息：https: //developer.mozilla.org/en/DOM/window.open
Do you need something like this (this is a crude example as I don"t know the name of your page, etc, etc...):
你需要这样的东西吗（这是一个粗略的例子，因为我不知道你的页面的名称等等……）：
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function open_win() {
window.open("mypage.html");
}
</script>
</head>
<body>
<form>
<input type="button" value="Open Window" onclick="open_win()">
</form>
</body>
</html>
However I'd advise doing this in an unobtrusive manner.
但是，我建议以不显眼的方式执行此操作。
