2016-04-09 10 views
0

入力からURLを使用して動的なsrc chngeを作成しようとしています。 これは私のコードです:入力タイプのテキストを使用してiframe srcを変更してください

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <title>Web</title> 
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
</head> 
<body> 
<form> 
    <input type="text" id="id"> 
    <input type="button" value="Change site" onClick="newSite()"> 
</form> 
    <iframe id="iframe" src="www.google.com"></iframe> 
    <script type="text/javascript"> 
     function newSite() { 
      var site = $('#id').val(); 
      document.getElementById('iframe').src = "http://" + site; 
     }  
    </script> 
</body> 
</html> 

は、だから私の質問は以下のとおりです。 ENTERを押してしてフォームを送信するためにどのように?そして、なぜそれは動作しませんか?

お返事ありがとうございます。

+0

あなたがボタンを押すと、それは動作しますか?最後に 'のように入力を閉じてみてください。 –

答えて

0

テキストボックスに完全なURLを入力してください。

function newSite() { 
 
    var site = $('#id').val(); 
 
    var iframe = document.getElementById('iframe'); 
 
    iframe.src = site; 
 
    iframe.src = iframe.src; 
 

 
}
<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <title>Web</title> 
 
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
</head> 
 
<body> 
 
\t <form> 
 
\t  <input type="text" id="id" /> 
 
\t  <input type="button" value="Change site" onClick="newSite()" /> 
 
\t </form> 
 
    <iframe id="iframe" src="http://www.lipsum.com/" width="900" height='500'></iframe> 
 
</body> 
 
</html>

関連する問題