Fatal编程技术网

用javascript处理弹出窗口

javascript html

用javascript处理弹出窗口,javascript,html,refresh,Javascript,Html,Refresh,我有一个有“添加链接”按钮的基本页，点击你会得到一个弹出窗口。弹出窗口有一个表单字段用于输入链接。一旦输入链接，我想刷新基本页-基本页不应再是“添加链接”，而是更改为在弹出窗口中输入的超链接 我不熟悉Javascript和html。到目前为止，我已经成功地在基本页面上创建了一个按钮，并在单击时显示一个弹出窗口，其中包含链接的表单字段。但是，我无法使用新链接刷新基本页 下面是我的代码： <!DOCTYPE html> <html> <body> <but

我有一个有“添加链接”按钮的基本页，点击你会得到一个弹出窗口。弹出窗口有一个表单字段用于输入链接。一旦输入链接，我想刷新基本页-基本页不应再是“添加链接”，而是更改为在弹出窗口中输入的超链接

我不熟悉Javascript和html。到目前为止，我已经成功地在基本页面上创建了一个按钮，并在单击时显示一个弹出窗口，其中包含链接的表单字段。但是，我无法使用新链接刷新基本页

下面是我的代码：

<!DOCTYPE html>
<html>
<body>

<button onclick="myFunction()">Add Link</button>

<p id="demo"></p>

<script>
function myFunction()
{
    prompt("Please Enter the Link"); 
}
</script>

</body>
</html>


添加链接


函数myFunction（）
{
提示（“请输入链接”）；
}
试试这个：

<button onclick="myFunction()">Add Link</button>

<p id="demo"></p>

<script>
function myFunction()
{
    var url = prompt("Please Enter the Link"); 
    window.location = url;
}
</script>

添加链接


函数myFunction（）
{
var url=提示（“请输入链接”）；
window.location=url；
}
js fiddle中唯一可以接受的值是

干杯

每次按下按钮时，都会显示提示，提示关闭后，脚本将向
演示
div添加一个新的
标记

<!DOCTYPE html>
<html>
    <body>
        <button onclick="myFunction()">Add Link</button>
        // This needs to be a 'div' so it can have elements inside it.            
        <div id="demo"></div> 
        <script>
            var demo = document.getElementById('demo');
            function myFunction()
            {
                // Stores the value from the prompt() in the variable 'value'
                var value = prompt("Please Enter the Link"); 
                var link = document.createElement('a'); // Create an <a> tag
                link.setAttribute('href', value); // Set the link's URL to the value.
                link.innerHTML = "New Link"; // Set the link's display text.
                demo.appendChild(link); // Add the link to the demo div.
            }
        </script>
    </body>
</html>


添加链接
//这需要是一个“div”，以便它可以包含元素。
var demo=document.getElementById（'demo'）；
函数myFunction（）
{
//将提示符（）中的值存储在变量“value”中
var值=提示（“请输入链接”）；
var link=document.createElement（'a'）；//创建标记
link.setAttribute（'href'，value）；//将链接的URL设置为该值。
link.innerHTML=“新建链接”；//设置链接的显示文本。
appendChild（link）；//将链接添加到demo div。
}
希望这些评论能够解释它是如何工作的，如果不只是在这里询问的话：）

您需要某种方式将链接存储在服务器上；刷新页面将导致所有内容都被重新执行，并且您无法真正动态地改变html文件本身。像django这样带有postgresql数据库的东西很容易设置，但这超出了您的问题范围

也就是说，如果在刷新页面时链接不存在，您可以使用文本区域而不是提示。如果您有jQuery，下面是一个示例：

<head>
<script>
$(function() {
$("#addLink").click(function() {
    var linkStr = document.getElementById("linkInput").value;
    $("#linkArea").html("<a href=" + linkStr + ">Your link</a>");
});
})
</script>
</head>

<span id="linkArea">
    <input id="addLink" type="submit" value="Add Link: ">
    <input id="linkInput" type="text" value="(enter link)">
</span>


$（函数（）{
$（“#添加链接”）。单击（函数（）{
var linkStr=document.getElementById（“linkInput”）.value；
$（“#linkArea”）.html（“”）；
});
})
下面是一个JSFIDLE来尝试：

哦，通常你应该把脚本放在head标签中。

嗨，谢谢你的回复。你能告诉我如何删除“添加链接”选项的基础页上一旦新的链接已被添加？嗨道格拉斯，我不想去的链接我添加后添加。我希望将链接显示为“新建链接”，而不是“添加链接”