it-swarm.com.de

Wie kann ich ein Bild in einem Alert/Confirm-Feld in Javascript anzeigen?

Wie kann ich ein Bild in einem Warnfeld oder in einem Bestätigungsfeld anzeigen? Ich habe mit dem folgenden Code versucht, aber die Image-URL im Benachrichtigungsfeld angezeigt. Bitte helfen Sie mir bei der Lösung oder geben Sie andere Vorschläge, falls dies nicht möglich ist.

var image = document.getElementById("myImage").src="hackanm.gif";
alert("OnLoad image"+image );
13
Mallikarjun

Benachrichtigungsfelder in JavaScript können nur reinen Text anzeigen. Sie können stattdessen eine JavaScript-Bibliothek wie jQuery verwenden, um einen Modal anzuzeigen.

Dies kann nützlich sein: http://jqueryui.com/dialog/

Sie können es so machen:

<!doctype html>

<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>jQuery UI Dialog - Default functionality</title>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
  <script>
  body {
    font-family: "Trebuchet MS", "Helvetica", "Arial",  "Verdana", "sans-serif";
    font-size: 62.5%;
}

  </script>
  <script>
  $(function() {
    $( "#dialog" ).dialog();
  });
  </script>
</head>
<body>

<div id="dialog" title="Basic dialog">
  <p>Image:</p>
  <img src="http://placehold.it/50x50" alt="Placeholder Image" />

</div>


</body>
</html>
9
LondonAppDev

Snarky noch potentiell nützliche Antwort: http://picascii.com/ (Vergessen Sie nicht, nach jeder Zeile ein\n zu setzen!)

7
liljoshu

Kurze Antwort: Das geht nicht.

Lange Antwort: Sie können ein modal verwenden, um ein Popup mit dem gewünschten Bild anzuzeigen.

Sie können sich auf this als Beispiel für eine Modalität beziehen.

4
Waclock

Wie bereits erwähnt, können Sie kein Bild in einer Warnmeldung anzeigen. Die Lösung besteht darin, es auf der Webseite anzuzeigen.

Wenn meine Webseite im Debugger angehalten ist und bereits ein Bild geladen ist, kann ich es anzeigen. Es ist nicht notwendig, jQuery zu verwenden. Mit diesen nativen 14 Zeilen von Javascript wird es vom Code oder der Debugger-Befehlszeile aus funktionieren:

function show(img){
 var _=document.getElementById('_'); 
 if(!_){_=document.createElement('canvas');document.body.appendChild(_);}
 _.id='_';
 _.style.top=0;
 _.style.left=0;
 _.width=img.width;
 _.height=img.height;
 _.style.zIndex=9999; 
 _.style.position='absolute';
 _.getContext('2d').drawImage(img,0,0);
}

Verwendungszweck:

show( myimage );
1
Michaelangel007

Verwenden Sie den jQuery-Dialog, um ein Bild anzuzeigen. Probieren Sie diesen Code aus

<html>
  <head>
    </head>
    <body>
     <div id="divid">
         <img>
     </div>
    <body>
  </html>


<script>
 $(document).ready(function(){
      $("btn").click(function(){
      $("divid").dialog();
   });
  });  
 </script>

`

zuerst müssen Sie die jQuery-Benutzeroberfläche auf Ihrer Seite einfügen.

1
Sanjay