堆棧內存溢出
  簡體   English   中英

我正在嘗試使用用戶通過JavaScript警報框輸入的信息在HTML頁面上創建鏈接

[英]I am trying to create a link on an HTML page using information that a user inputs via JavaScript alert box

 原文  2013-09-04 02:57:47  6   6    javascript/ html

問題描述

到目前為止，基本上我所擁有的頁面是具有兩個彈出/警告框的頁面。 第一個要求用戶輸入他們喜歡的網站的名稱。 第二個要求用戶將URL輸入到他們喜歡的網站。 結果應該以用戶輸入的名稱顯示在主頁上的超鏈接中，該名稱指向用戶單擊時輸入的URL。 這是我的代碼： 

<!DOCTYPE HTML>
<html>
    <head>
        <title>Untitled</title>
    </head>
    <body>
        <script type="text/javascript">
            var favoriteSite;
            favoriteSite = prompt ("What is your favorite web site?")
            favoriteSite = prompt ("What is the URL of that site?") 
            document.write('<a href="' + favoriteSite + '"></a>')
        </script>                       
        <h1>Link to favorite site.</h1>
        <h2>This is my favorite web site</h2>  
    </body>
</html>

PS。 我是JavaScript的初學者，非常感謝您的協助。 謝謝。

我最終將其更改為： 

<html>
    <head>
        <title>Untitled</title>
    </head>
    <body>
        <script type="text/javascript">
            var favoriteSite;
            var favoriteSiteName;
            favoriteSiteName = prompt ("What is your favorite web site?");
            favoriteSite = prompt ("What is the URL of that site?"); 
            document.write("<h1>Link to favorite website.</h1>");
            document.write("<h2>This is my favorite web site" +" " +     favoriteSiteName.link("https://" + favoriteSite + "") + "</p>");
        </script>                       
    </body>
</html>

6 個解決方案

解決方案1
 0  2013-09-04 03:03:26

你所擁有的幾乎是正確的。 

var favoriteSiteName = '',
    favoriteSiteURL = '';

favoriteSiteName = prompt('What is your favorite web site?');
favoriteSiteURL = prompt('What is the URL of that site?');
document.write('<a href="' + favoriteSiteURL + '">' + favoriteSiteName + '</a>');

您缺少分號來指示行的末尾，並將站點名稱添加到鏈接中。 同樣， h1和h2元素也不屬於script元素。

JSFiddle。

解決方案2
 0  2013-09-04 03:03:40

您需要為超鏈接設置文本，否則超鏈接將不可見。 

favoriteSiteName = prompt ("What is your favorite web site?")

favoriteSite = prompt ("What is the URL of that site?") 

document.write('<a href="' + favoriteSite + '">'+favoriteSiteName+'</a>')

附帶說明，您應該避免使用提示或警報。 多個此類對話框將使用戶煩惱，瀏覽器將發出警告，UI自動化測試變得困難。 您可以使用jquery ui對話框或div彈出窗口獲取用戶輸入，並使用jquery創建超鏈接。

解決方案3
 0  2013-09-04 03:03:41

您缺少分號，並且網站和網址變量相同。 設置超鏈接的文本，否則超鏈接將不可見 

var favoriteSite;
var favoriteUrl ;

 favoriteSite = prompt ("What is your favorite web site?");

 favoriteUrl = prompt ("What is the URL of that site?"); 

document.write('<a href="' + favoriteSite + '">Site</a>');
document.write('<a href="' + favoriteUrl + '">Url</a>');

</script>

解決方案4
 0  2013-09-04 03:06:24

遠離document.write ！！！

為什么document.write被認為是“不良做法”？

現場演示

JS 

//Get the text you want to display
var text = document.createTextNode(prompt ("What is your favorite web site?")); 

//Create an attribute to for the href
var href = document.createAttribute("href");
href.value = prompt ("What is the URL of that site?") 

//Create a link
var link = document.createElement('a');

//Add the attribute to the link
link.setAttributeNode(href);

//Add the text to the link
link.appendChild(text); 

//Add the link to the page
document.getElementById('link').appendChild(link);

的HTML 

<h1>Link to favorite site.</h1>

<h2>This is my favorite web site: <span id='link'></span></h2>

最后，我會認真考慮使用一個框架來處理您的DOM操作。 jQuery是一個很好的學習對象。

解決方案5
 0  2013-09-04 03:07:01

是的document.write會覆蓋所有現有的文檔節點..並且您應該嘗試在運行腳本之前等待頁面加載。 

<!doctype html>

<html>
  <head>
    <script type='text/javascript'>
      window.addEventListener("load",function(){
        var siteName = prompt("what is you fave site name?");
        var siteURL = prompt("what is its URL?");
        var a = document.body.appendChild(document.createElement("a"));
        a.href = siteURL;
        a.innerHTML = siteName;
      });
    </script>
  </head>

  <body>

  </body>
</html>

解決方案6
 0  2013-09-04 03:10:19

您的鏈接中沒有任何內容。 嘗試這樣的事情：

看JS：

http://jsbin.com/enOWeCI/1/edit

查看實際效果：

http://jsbin.com/enOWeCI/1/

暫無
暫無

聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

相關問題 我正在嘗試使用JavaScript將HTML頁面上的圖像隨機化 我正在嘗試創建一個彈出窗口，提醒用戶該網站不適合兒童 我正在嘗試創建一個javascript頁面以將信息輸入表單，但無法正常工作 Javascript：不使用警報框的警報用戶 我正在嘗試使用 javascript 創建一個簡單的登錄頁面，這將允許用戶正確輸入他們的用戶名和密碼，直到 3 次僅嘗試 我正在嘗試使用表格輸入表格 使用 javaScript 將輸入信息發送到另一個 html 頁面 Javascript：我正在嘗試在用戶在頁面上滾動時創建滾動，但我一直遇到“moveImaeCalc”的 NaN 錯誤 我正在嘗試編寫一個在警報框中顯示用戶輸入級別的函數 我正在嘗試使用javascript更改鏈接的顏色並且它不起作用
相關標簽
 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM