如何使用AJAX在输入栏中搜索准确的短语或单词?

时间:2017-04-09 作者:rob.m

我一直在following this 它几乎可以完美地工作,但它不仅可以根据我们在输入字段中所写的内容查找具有相同单词的标题帖子,而且可以查找所有帖子。

HTML

<input name="usp-title" id="usp-title" type="text" value="" data-required="true" required="required" maxlength="99" placeholder="Type here..." class="usp-input usp-input-title form-control">
阿贾克斯

add_action( \'wp_footer\', \'ajax_fetch\' );
function ajax_fetch() {
?>

<script type="text/javascript">

function fetch(){
console.log(jQuery(\'#usp-title\').val());
        jQuery.ajax({
            url: \'<?php echo admin_url(\'admin-ajax.php\'); ?>\',
            type: \'post\',
            data: { action: \'data_fetch\', exactwords:  jQuery(\'#usp-title\').val() },
            success: function(data) {
            var text1;
            var text1B;
            var text2;
            var text2B;
                    jQuery("#datafetch").html(data).promise().done(function(){
                        text1 = jQuery("#datafetch").find("h2").find("a").html();
                        text1B = text1.toLowerCase();
                text2 = jQuery(\'#usp-title\').val();
                        text2B = text2.toLowerCase();
                console.log(text1B);
                console.log(text2B);
                        if (text1B != text2B) {
                            jQuery("#componi").removeAttr("disabled", "disabled").show();
                            jQuery("#fatto").hide();
                            //jQuery(\'#datafetch\').empty();
                        } else if (text1B == text2B) {
                            jQuery("#componi").attr("disabled", "disabled").hide();
                        }
            });
            }
        });
}
</script>
PHP

add_action(\'wp_ajax_data_fetch\' , \'data_fetch\');
add_action(\'wp_ajax_nopriv_data_fetch\',\'data_fetch\');
function data_fetch(){

    $the_query = new WP_Query( array( \'posts_per_page\' => 1, \'s\' => esc_attr( $_POST[\'usp-title\'] ), \'post_type\' => \'post\' ) );
    if( $the_query->have_posts() ) : ?> 
       <div class="jumbotron">
        <h4>Abbiamo trovato già delle lezioni con lo stesso titolo,<br>usa una di questa o scrivi un titolo diverso.</h4>
    </div>
       <ul class="list-unstyled margin-top-80">
        <?php while( $the_query->have_posts() ): $the_query->the_post(); ?>
           <li>
        <?php $time = usp_get_meta(false, \'usp-custom-10\'); ?>
        <?php $space = usp_get_meta(false, \'usp-custom-3\'); ?>
        <?php $spaceB = usp_get_meta(false, \'usp-custom-7\'); ?>
            <h2><a target="_blank" href="<?php echo esc_url( post_permalink() ); ?>"><?php the_title();?></a></h2>
            <p><strong>Spazio:</strong> <?php echo $space;?> <?php echo $spaceB; ?></p>
         <p><strong>Tempo:</strong> <?php echo $time; ?></p>
         <?php the_excerpt(); ?>
           </li>
        <?php endwhile;
        wp_reset_postdata(); ?>
      </ul>
    <?php endif;

    die();
}
如何将结果限制为与输入字段中的文本具有相同标题的结果?

1 个回复
SO网友:rob.m

这更像是一种黑客行为,但我找不到其他方法,尝试过了exact= "true"sentence="true" 作为查询中的参数,但我仍然拥有所有结果,而不仅仅是完全匹配的结果。因此,由于我作为list, 我正在检查DOM 删除任何与.val()

function searchAjax(){
  jQuery.ajax({
    url: \'<?php echo admin_url(\'admin-ajax.php\'); ?>\',
    type: \'post\',
    data: { action: \'data_fetch\', exactwords:  jQuery(\'#usp-title\').val() },
    success: function(data) {
      var text2;
      var text2B;
      text2 = jQuery(\'#usp-title\').val();
      text2B = text2.toLowerCase();
      jQuery("#datafetch").html(data).promise().done(function(){
        jQuery("#datafetch ul li h2 a").each(function() {
          var $this = jQuery(this);
          if ($this.text().toLowerCase() !== text2B) {
            $this.parent().parent().remove();
            jQuery(".jumbotron").remove();
            jQuery("#componi").removeAttr("disabled", "disabled").show();
          } else if ($this.text().toLowerCase() == text2B) {
            jQuery("#componi").attr("disabled", "disabled").hide();
          }
        });
      });
    }
  });
}

相关推荐

如何全局使用wp_LOCALIZE_SCRIPT()AJAX URL

我已将此添加到functions.php 并且需要使用ajaxURL 在模板中的所有排队脚本中(而不是在此处仅将一个脚本排队add_action( \'wp_enqueue_scripts\', \'ajaxify_enqueue_scripts\' ); function ajaxify_enqueue_scripts() { wp_localize_script( \'ajaxify\', \'ajaxURL\', array(\'ajax_url\' => get_tem