Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> JavaScript

วิธีแสดงรูปภาพใน Alert Box ด้วย JavaScript


เพื่อแสดงรูปภาพใน alert box ลองรันโค้ดต่อไปนี้ ที่นี่มีการเพิ่มรูปภาพแจ้งเตือนใน custom alert box

ตัวอย่าง

<!DOCTYPE html> <html>    <head>       <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js">       </script>       <script>          function functionAlert(msg, myYes) {             var confirmBox = $("#confirm");             confirmBox.find(".message").text(msg);             confirmBox.find(".yes").unbind().click(function() {                confirmBox.hide();             });             confirmBox.find(".yes").click(myYes);             confirmBox.show();          }       </script>       <style>          #confirm {             display: none;             background-color: #FFFFFF;             border: 1px solid #aaa;             position: fixed;             width: 250px;             left: 50%;             margin-left: -100px;             padding: 6px 8px 8px;             box-sizing: border-box;             text-align: center;          }          #confirm button {             background-color: #48E5DA;             display: inline-block;             border-radius: 5px;             border: 1px solid #aaa;             padding: 5px;             text-align: center;             width: 80px;             cursor: pointer;          }          #confirm .message {             text-align: left;          }       </style>    </head>    <body>       <div id="confirm">          <div class="message">This is a warning message.</div>          <button class="yes">OK</button>          <img src = "https://encrypted-tbn0.gstatic.com/images?q=                      tbn:ANd9GcSNjyHBjM74KLxvROpx34zsT4zPzMWHMHz4zzJwAtemXGglsjtA"                       width="120" height="70"/>       </div>       <input type="button" value="Click Me" onclick="functionAlert();" />    </body> </html>