How to put the jQuery ui autocomplete menu into an iframe?
I want to put the suggestion menu into an iframe so that the suggestion information could not be covered by the next frame. So ,what should i do?
Well ,I've tried to modify the menu codes like
- <div><iframe style='position: absolute; z-index: -1; width: 100%; height: 100%; top: 0;left: 0; scrolling: no;' frameborder='0' src='about:blank'><ul></ul></iframe></div>
, but unfortunately it doesn't work.
the autocomplete code:
- this.menu = $( "<ul></ul>" )
.addClass( "ui-autocomplete" )
.appendTo( $( this.options.appendTo || "body", doc )[0] )
// prevent the close-on-blur in case of a "slow" click on the menu (long mousedown)
.mousedown(function( event ) {
// clicking on the scrollbar causes focus to shift to the body
// but we can't detect a mouseup or a click immediately afterward
// so we have to track the next mousedown and close the menu if
// the user clicks somewhere outside of the autocomplete
var menuElement = self.menu.element[ 0 ];
if ( !$( event.target ).closest( ".ui-menu-item" ).length ) {
setTimeout(function() {
$( document ).one( 'mousedown', function( event ) {
if ( event.target !== self.element[ 0 ] &&
event.target !== menuElement &&
!$.ui.contains( menuElement, event.target ) ) {
self.close();
}
});
}, 1 );
}