-1
私はライブ検索フォームworking version, を使用しますが、なぜ私の動作がうまくいかないのですか？ divクラス= "wrapper faq"が物事を混乱させているからです。検索フォームが機能しないのはなぜですか？
申し訳ありませんが、slobby htmlの場合、1500行と4つのcssドキュメントをコピーしても助けにはなりませんでした。
ありがとうございます！
<script>
\t 'use strict';
\t // search & highlight
\t ;(function($, window, document, undefined)
\t {
\t \t var $container = $('.faq');
\t \t if(!$container.length) return true;
\t \t var $input \t \t \t = $container.find('input'),
\t \t \t $notfound \t \t = $container.find('.faq__notfound'),
\t \t \t $items \t \t \t = $container.find('> ul > li'),
\t \t \t $item \t \t \t = $(),
\t \t \t itemsIndexed \t = [];
\t \t $items.each(function()
\t \t {
\t \t \t itemsIndexed.push($(this).text().replace(/\s{2,}/g, ' ').toLowerCase());
\t \t });
\t \t $input.on('keyup', function(e)
\t \t {
\t \t \t if(e.keyCode == 13) // enter
\t \t \t {
\t \t \t \t $input.trigger('blur');
\t \t \t \t return true;
\t \t \t }
\t \t \t $items.each(function()
\t \t \t {
\t \t \t \t $item = $(this);
\t \t \t \t $item.html($item.html().replace(/<span class="highlight">([^<]+)<\/span>/gi, '$1'));
\t \t \t });
\t \t \t var searchVal = $.trim($input.val()).toLowerCase();
\t \t \t if(searchVal.length)
\t \t \t {
\t \t \t \t for(var i in itemsIndexed)
\t \t \t \t {
\t \t \t \t \t $item = $items.eq(i);
\t \t \t \t \t if(itemsIndexed[ i ].indexOf(searchVal) != -1)
\t \t \t \t \t \t $item.removeClass('is-hidden').html($item.html().replace(new RegExp(searchVal+'(?!([^<]+)?>)', 'gi'), '<span class="highlight">$&</span>'));
\t \t \t \t \t else
\t \t \t \t \t \t $item.addClass('is-hidden');
\t \t \t \t }
\t \t \t }
\t \t \t else $items.removeClass('is-hidden');
\t \t \t $notfound.toggleClass('is-visible', $items.not('.is-hidden').length == 0);
\t \t });
\t })(jQuery, window, document);
\t // toggling items on title press
\t ;(function($, window, document, undefined)
\t {
\t \t $(document).on('click', '.faq h2 a', function(e)
\t \t {
\t \t \t e.preventDefault();
\t \t \t $(this).parents('li').toggleClass('is-active');
\t \t });
\t })(jQuery, window, document);
\t // auto-show item content when show results reduces to single
\t ;(function($, window, document, undefined)
\t {
\t \t var $container = $('.faq');
\t \t if(!$container.length) return true;
\t \t var $input \t \t = $container.find('input'),
\t \t \t $items \t \t = $container.find('> ul > li'),
\t \t \t $item \t \t = $();
\t \t $input.on('keyup', function()
\t \t {
\t \t \t $item = $items.not('.is-hidden');
\t \t \t if($item.length == 1)
\t \t \t \t $item.addClass('js--autoshown is-active');
\t \t \t else
\t \t \t \t $items.filter('.js--autoshown').removeClass('js--autoshown is-active');
\t \t });
\t })(jQuery, window, document);
</script><!-- Search bar -->
<div class="search-wrapper faq" >
<div class="container container--add faq">
<input type="search" value="" placeholder="Search">
</div>
</div>
<!-- Movie preview item -->
<div id="Page1" class="page" style="">
<ul>
\t <li id="faq-1">
\t <h2><a href="#faq-1" class="movie__title link--huge">Last Vegas (2013)</a></h2>
<div class="movie movie--preview movie--full release">
<div class="col-sm-3 col-md-2 col-lg-2">
<div class="movie__images">
<img alt='' src="images/movie/movie-sample1.jpg">
</div>
</div>
<div class="col-sm-9 col-md-10 col-lg-10 movie__about">
</div>
</div>
<div class="clearfix"></div>
</div>
</li>
<!-- end movie preview item -->
<!-- Movie preview item -->
<li id="faq-2">
\t <h2><a href="#faq-2" class="movie__title link--huge">the book thief (2013)</a></h2>
<div class="movie movie--preview movie--full comments">
<div class="col-sm-3 col-md-2 col-lg-2">
<div class="movie__images">
<img alt='' src="images/movie/movie-sample2.jpg">
</div>
</div>
<div class="col-sm-9 col-md-10 col-lg-10 movie__about">
</div>
</div>
<div class="clearfix"></div>
</div>
</div>
</li>
</ul>
<!-- end movie preview item -->
</div>
[mcve]！を入力してください。 –