Типу Результаты поиска в Bootstrap Модал? - PullRequest
Новая
       13

Типу Результаты поиска в Bootstrap Модал?

0 голосов
/ 01 марта 2020

Я - ладья ie разработчик, пытающийся отобразить результаты поиска Tipue в Bootstrap модале. Когда все соединено, модальное окно открывается при щелчке по полю ввода (вместо ожидания, пока слово не будет введено и щелкнуто). Кажется, это конфликт между Bootstrap и Tipue Search. Поиск часов в Интернете и переполнение стека не дали обходного пути. Пожалуйста помоги. Заранее спасибо.

URL-адреса

Мой код: 

<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<title>Tipue Search, a jQuery Site Search Plugin</title>
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<link href="lib/bootstrap-4.1.3/dist/css/bootstrap.css" type="text/css" rel="stylesheet">	
		<script src="lib/jquery/jquery-3.3.1.min.js" type="text/javascript"></script>
		<script src="lib/tipuesearch/tipuesearch_set.js"></script>
		<script src="lib/tipuesearch/tipuesearch_content.js"></script>
		<script src="lib/tipuesearch/tipuesearch.js"></script>
		<script src="lib/lightbox-2.11.1/js/lightbox.js" type="text/javascript"></script>		
		<script src="lib/bootstrap-4.1.3/dist/js/bootstrap.js" type="text/javascript"></script>		
	</head>
	<body>
		<div class="container">
			<h2>A demo for version 7.1, My Local</h2>
			<p>Enter <code>tipue</code> or <code>blog</code>.</p>
			<form class="">
				<input 
					class="form-control form-control-sm mr-3" 
					type="text" name="q" 
					id="tipue_search_input" 
					data-toggle="modal" 
					data-target="#search-results" aria-label="Search">
			</form>	
			<div id="search-results" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="search-results-label">
				<div class="modal-dialog modal-dialog-scrollable modal-lg" role="document">
					<div class="modal-content">
						<div class="modal-header">
							<h4 class="modal-title" id="search-results-label">Search Results</h4>
							<button type="button" class="close" data-dismiss="modal" aria-label="Close">
								<span aria-hidden="true">&times;</span>
							</button>
						</div>
						<div class="modal-body">
							<p>Testing 123</p>
							<div id="tipue_search_content"></div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<script>
			$(document).ready(function() {
				 $('#tipue_search_input').tipuesearch();
			});
		</script>
	</body>
</html>

(функция ($) {

 $.fn.tipuesearch = function(options) {

      var set = $.extend( {

      'contextBuffer'          : 60,
      'contextLength'          : 60,
      'contextStart'           : 90,
      'debug'                  : false,
      'descriptiveWords'       : 25,
      'footerPages'            : 3,
      'highlightTerms'         : true,
      'imageZoom'              : true,
      'minimumLength'          : 3,
      'newWindow'              : false,
      'show'                   : 10,
      'showContext'            : true,
      'showRelated'            : true,
      'showTime'               : true,
      'showTitleCount'         : true,
      'showURL'                : true,
      'wholeWords'             : true
      }, options);

      return this.each(function() {

           var tipuesearch_t_c = 0;                         

           var tipue_search_w = '';
           if (set.newWindow)
           {
                tipue_search_w = ' target="_blank"';      
           }

           function getURLP(name)
           {
                var locSearch = location.search;
                var splitted = (new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(locSearch)||[,""]);
                var searchString = splitted[1].replace(/\+/g, '%20');
                try
                {
                     searchString = decodeURIComponent(searchString);
                }
                catch(e)
                {
                     searchString = unescape(searchString);
                }
                return searchString || null;
           }

           if (getURLP('q'))
           {
                $('#tipue_search_input').val(getURLP('q'));
                getTipueSearch(0, true);
           }               

           $(this).keyup(function(event)
           {
                if(event.keyCode == '13')
                {
                     getTipueSearch(0, true);
                }
           });
...