亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

警報框觸發后,文檔一側出現“未定義”

警報框觸發后,文檔一側出現“未定義”

揚帆大魚 2023-10-04 14:32:00
我一直在制作一個網站,如果您單擊按鈕,就會彈出一個警報框。但在我單擊按鈕后,“未定義”一詞出現在文檔的一側。我一直這樣做的方式是這樣的:<button onclick="run()">Click me</button><span id="no"></span><script>function no() {document.getElementById("no").innerHTML = alert("This is an alert box");}</script>由于某種原因,單擊按鈕后,文檔上出現“未定義”字樣。正如您所看到的,如果您運行該代碼片段,一旦您單擊其中一個“購買”按鈕,如果您向下滾動到產品頁面的底部,您將在左側看到“未定義”一詞。我不應該使用這種方法嗎?有什么辦法可以在不改變我的方法的情況下阻止這種情況發生嗎?我很抱歉它太混亂了,它不適合在堆棧溢出片段創建器上運行。注意:本網站并不具有專業性。事實上,它的設計很糟糕。這就是我使用該<center>屬性的原因。
查看完整描述

3 回答

?
MYYA

TA貢獻1868條經驗 獲得超4個贊

javascript 中的方法alert沒有返回值,而 javascript 中的返回值是undefined.

您將span內部 html 設置為該值

document.getElementById("no").innerHTML = alert("Sorry, but we're all sold out! Try again later.");

我很好奇你認為上面這行做了什么。


查看完整回答
反對 回復 2023-10-04
?
瀟湘沐

TA貢獻1816條經驗 獲得超6個贊

為什么要設置要提醒的元素的innerHTML?


function purchase() {

  alert("Sorry, but we're all sold out! Try again later.");

}

<!--Copyright 2020 AWOL Industries International. All rights reserved-->


<!DOCTYPE html>

<html>


<head profile="http://www.w3.org/2005/10/profile">

  <title>Buy stuff at a high price!</title>

  <link rel="icon" type="image/png" href="https://cdn.hipwallpaper.com/i/63/61/AykYVG.png">

</head>


<body>

  <center>

    <h1 style="color:red; background-color:black">AWOL INDUSTRIES INTERNATIONAL</h1>

  </center>



  <style>

    center.mission {

      font-family: serrif;

      font-size: 180%;

      background-color: rgb(100, 200, 0);

      LINE-HEIGHT: 1;

    }

    

    body {

      background-color: rgb(196, 255, 196);

    }

  </style>



  <!--Our products-->

  <p>

    </br>

    <center class="products">

      <h1>OUR PRODUCTS</h1>

    </center>

    <center>

      <h3>NO RETURNS</h3>

    </center>

    <br/>

    <div id="column1">Single sheet 8.5"/11" printer paper

      <br/>

      <img src="https://www.backgroundsy.com/file/large/blank-paper-background.jpg" height="150px" width="350px" />

      <button onclick="purchase()">BUY NOW FOR $19.99</button>

    </div>

    <div id="column2">Single sheet 8.5"/11" printer paper(pre-crumpled)

      <br/>

      <center><img src="https://149351503.v2.pressablecdn.com/wp-content/uploads/2015/09/paper_71_closed.png" height="150px" width="200px" /></center>

      <button onclick="purchase()">BUY NOW FOR $34.99</button>

    </div>

    <div id="column3">Single CD-R disc, scratched

      <br/>

      <img src="https://i.redd.it/akbvkcw2xgmz.jpg" height="150px" width="250px" />

      <br/>

      <button onclick="purchase()">BUY NOW FOR $42.99</button>

    </div>

    <style>

      center.products {

        color: green;

        background-color: purple;

      }

      

      div {

        float: left;

        height: 200px;

        width: 200px;

        padding: 0 10px;

      }

      

      #column1 {

        background-color: lightgrey;

        width: 30%;

      }

      

      #column2 {

        background-color: grey;

        width: 30%;

      }

      

      #column3 {

        background-color: darkgrey;

        width: 30%;

      }

    </style>

    <div id="column4">Single toilet paper square for quarentine days

      <br/>

      <img src="https://photos1.blogger.com/blogger/7265/3234/1600/napkin.jpg" height="150px" width="250px" />

      <button onclick="purchase()">BUY NOW FOR $12.99</button>

    </div>

    <div id="column5">Single use toothpick

      <br/>

      <center><img src="https://sc02.alicdn.com/kf/HTB1sYpPQpXXXXcPXXXXq6xXFXXXu.jpg" height="150px" width="300px" /></center>

      <button onclick="purchase()">BUY NOW FOR $6.99</button>

    </div>

    <div id="column6">10cm dental floss

      <br/>

      <img src="https://upload.wikimedia.org/wikipedia/commons/5/53/Dental_floss_%28whole%29.jpg" height="150px" width="250px" />

      <br/>

      <button onclick="purchase()">BUY NOW FOR $339.99</button>

    </div>

    <style>

      center.products {

        color: green;

        background-color: purple;

      }

      

      div {

        float: left;

        height: 200px;

        width: 200px;

        padding: 0 10px;

      }

      

      #column4 {

        background-color: darkgrey;

        width: 30%;

      }

      

      #column5 {

        background-color: lightgrey;

        width: 30%;

      }

      

      #column6 {

        background-color: grey;

        width: 30%;

      }

    </style>


    <!--For click events-->

    <span id="no"></span>


</body>


</html>

這將解決您的問題。



查看完整回答
反對 回復 2023-10-04
?
至尊寶的傳說

TA貢獻1789條經驗 獲得超10個贊

在 javascript 中,任何未定義的變量(或屬性)都是undefined(這是一種類型,如String、Object、Date、null等)。當這個結果被強制轉換為字符串時,它顯示為實際的字符串“未定義”。在瀏覽器的控制臺中嘗試以下操作來感受一下:


console.log(foo);

console.log(window.foo);

console.log(String(window.foo));

當您將 div 的屬性分配給警報函數innerHTML的結果(它不返回任何內容,因此值為)時,您將其強制轉換為字符串“undefined”并將其設置為分區?您的實際預期行為是什么?undefined



查看完整回答
反對 回復 2023-10-04
  • 3 回答
  • 0 關注
  • 129 瀏覽

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號