2016-11-09 4 views
0

私はiFrameのためにTwitterの先読みライブラリを使用してオートコンプリートを実装しようとしていますので、iframeで入力を開始すると表示が始まりますが、それはisntです。iFrameでTypeaheadを使用する

HTMLコード

<!DOCTYPE html> 
<html> 
    <head> 
     <script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
     <script type="text/javascript" src="http://twitter.github.io/typeahead.js/releases/latest/typeahead.bundle.js"></script> 
    </head> 
    <body> 
     <iframe id="editorArea-frame" style="width:100%; height:100%;" frameborder="0"></iframe> 
    </body> 
</html> 
<script type="text/javascript" src="iframe.js"></script> 

Javascriptコード

var editorFrame = $('#editorArea-frame')[0]; 

var html = ''; 

html += '<style type="text/css">pre { background-color: #eeeeee; }</style>'; 

html += '<style type="text/css">html,body { cursor: text; } #editorDiv { display: inline-block; height: 100%; width: 100%; overflow-y:scroll; outline: none;}</style>'; 

html += '<body></div><div id="editorDiv" contentEditable="true"></div></body>'; 

editorFrame.contentDocument.open(); 

editorFrame.contentDocument.write(html); 

editorFrame.contentDocument.close(); 

私はjavascriptのコードのこの部分を実行すると、IFRAMEが空白になり、その身体は誰のように私を指すempty.Canなり、何が間違っているの?

$('#editorArea-frame').typeahead({ 
     source: function(typeahead, query) { 
     return ['alpha', 'beta', 'bravo', 'delta', 'epsilon', 'gamma', 'zulu']; 
     } 
    }); 

答えて

0

入力フィールドにtypeaheadを適用する必要があります。 可能であればiframeを避けることをお勧めします。これにより、脳細胞の一部を節約することができます。

+0

iveが正常に実装されました。ヘルプありがとうございました –

+0

どうしましたか?私はやってみようとしているが、私は@KartikJainできない – eagle

関連する問題