[Resolvido] mostrar imagem sem fazer upload, só com a url

<?php

 $url = $_POST['url'];

 echo "<img src='".$url."'>";

?>

<form method="post">

 <input type="text" name="url">

 <input type="submit" name="submit" value="mostrar">

</form>

em div

<?php
 $url = $_POST['url'];
 echo "<script>document.getElementById('imagem').innerHTML = '<img src={$url}>'</script>";
?>
<div id='imagem'>
</div>

obrigado a vcs que responderam o primeiro funcionou o segundo não victor, vlw galera! vo tentar fazer o segundo funcionar

@Victor Cometti o erro do script, é que você tenta usar o elemento antes dele existir.

chame no window.onload ou coloque o script após o elemento no fluxo do documento.

vlw william, eu ia colocar em uma função e editei acabou ficando assim!!

legal posta ae pra eu ver o certo! se puder vlw.

fiz assim levando em conta que num entendo java, mas li o que o moderador falou, ficando assim e deu certo!!

<?php
 $url = $_POST['url'];

 ?>

<html>
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
 <title></title>
 <style type="text/css">
 #imagem{width: 100%;}
 #imagem #pic{width: 125px; height: 193px; border: 1px solid black; cursor: pointer;}
 </style>
 </head>
 <body>
 <div id="imagem">
 <div id="pic"><?php echo "<script>document.getElementById('pic').innerHTML = '<img src={$url}>'</script>";?><!--<img alt="" src="img/click.png">--></div>
 </div>
 <form action="" method="post">
 <input type="text" name="url">
 <input type="submit" name="submit" value="mostrar">
 </form>
 </body>
</html>

Agora uma ideia tem como fazer isso clicando dentro da div e abrindo a caixa de dialogo pra colocar a url? tipo um evento click?

isso

<script>
window.onload = function(){
<?php
 echo "document.getElementById('pic').innerHTML = '<img src={$_POST['url']} onclick=window.open(\"{$_POST['url']}\")>'";
?>
}
</script>
<div id='pic'></div>

Não funcionou!... rsrs mas vlw pela ajuda amigo.. vo continuar a procurar essa ideia.. de clicar e abrir a caixa de dialogo com o campo para inserção da url, vlw obrigado pela tua atenção!..

cara... ai é javascript puro...

<html>
<head>
<script type="text/javascript">
function id( el ){
	return document.getElementById( el );
}
window.onload = function(){
	id('imagem').onclick = function(){
 var caminho = prompt('Insira a url da imagem');
 this.innerHTML = '<img src="'+caminho+'" alt="" />';
	}
}
</script>
</head>
<body>
	<div id="imagem">
 Clique aqui para inserir uma imagem
	</div><!-- imagem -->
</body>
</html>

perfeito, mas num entendi nada rs, se pudesse me ajudar a entender deixando uns comentários eu ja deixaria de ser um leigo e passaria a saber mais algumas coisas em java, cara era essa a idéia, corrétissimo.... muito obrigado, mas fico envergonhado de simplesmente pegar o código, na verdade quero aprender.... vlw! a todos..

sem querer ser chato, mas como você fez em java, saca só pra eu num fica te amolando onde acho sobre esse prompt ae, porque se eu não insiro a imagem apenas cancelo ele gera uma imagem com um X vermelho saca como se não tivesse imagem...

cara... é javascript e não Java

são 2 linguagens completamente diferentes, okay ?

estamos escrevendo javascript aqui.

prompt() é uma função nativa da linguagem.

se você não insere, ele gera o src="" (igual a nada), por isso o x vermelho.. que seria de 'imagem não encontrada'

você pode filtrar isso, e obrigar o cara a digitar algo.

pode deixar ele digitar no input mesmo..

enfim.. várias possibilidades.

fiz assim ó , pesquisei sobre o prompt(); forçando o usuário a digitar uma url, apesar de que se digitar qualquer coisa da certo tmb... o legal seria ele voltar a imagem que aparece ao carregar quando cancelasse... mas ai num achei nada que me desse essas opções..

/applications/core/interface/imageproxy/imageproxy.php?img=http://img526.imageshack.us/img526/5477/clickm.png&key=281ac5ee8abca77eb87a987d5296fd13c16e3e9f2106843f97cd984f7b0390f0" alt="Imagem Postada" />

<html>
 <head>
 <script type="text/javascript">
 var caminho;
 function id( el ){
 return document.getElementById( el );
 }
 window.onload = function(){
 id('imagem').onclick = function(){
 do{
 caminho = prompt('Insira a url da imagem');
 }while
 (caminho == null || caminho == "");
 this.innerHTML = '<img src="'+caminho+'" alt="" />';

 }
 }
 </script>
 <style type="text/css">
 #pic{width: 100%;}
 #pic #imagem {width: 125px; height: 193px; border: 1px solid black; cursor: pointer;}
 </style>
 </head>
 <body>
 <div id="pic">
 <div id="imagem">
 <img alt="" src="img/click.png">
 </div><!-- imagem -->
 </div>
 </body>
</html>

só que tem um porém tipo no ie ele aparece undefined no input e no mozila não, como eu tiro isso