Question

在我的asp页面中，我想在用户点击按钮时显示一个弹出窗口。弹出窗口包含一个文本框和提交按钮，用于从用户获取文件路径。

例如：我想在stackoverflow站点中使用这样的弹出窗口...

enter image description here

请告诉我这个......

Answer 1

这是一个EDITED:demo。根据您的需求自定义它。让我知道是否需要进一步的帮助。我添加了一个链接，它会在点击时显示弹出窗口。之后弹出div是实际的弹出窗口，弹出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>

这是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;

}

修改要获取文本框的值，请选中This demo

要点击Asp.Net按钮调用javascript函数，请尝试执行此类操作。创建一个显示弹出窗口的函数。

function ShowPopUp() { $('#popup').show("slow"); }

点击按钮，试试这个，

ClientScript.RegisterStartupScript(GetType(), "popup", "ShowPopUp()", true);

其他信息 MSDN

Answer 2

如果我理解正确您想使用window.open，请参阅以下信息：https://developer.mozilla.org/en/DOM/window.open

你需要这样的东西（这是一个粗略的例子，因为我不知道你的页面的名称等等）：

<!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>

但是我建议以不引人注目的方式这样做。

如何在javascript中显示带有文本框和浏览按钮的弹出窗口？

2 个答案: