图像AJAX搜索不适用于Safari

我有一个实时图像搜索，使用AJAX和SQL查询来查找名称与用户在文本字段上输入相同的图像。我认为它工作正常，直到我在Safari中进行测试，它确实没有任何问题。图像AJAX搜索不适用于Safari

我不太确定为什么即使在Safari中返回错误，有没有人知道Safari中的问题可能会阻止它工作？

的jQuery：

var input = $('.image-search'); 
var value; 

var append = $(".results-append"); 
var loadUrl = '/stock-image-search.php'; 

var results = $('.results'); 

var resultsDiv = '<div class="results-heading"><h2>Results for "<span class="results-for"></span>"</h2></div>'; 
var resultsFor; 

var nothingFound = '<div class="nothing-found"><br /><span>No results found.</span></div>' 


// on keyup 
input.on("keyup", function() { 

    // remove everything that was there 
    $('.results-append').remove(); 
    results.empty(); 
    $("#temp_load").remove(); 

    value = input.val(); 
    append.prepend(resultsDiv); 

    resultsFor = $('.results-for'); 
    resultsFor.html($(this).val()); 

    // ajax the results! 
    $.ajax({ 
     type: "GET", 
     data: { 
      nameLike: value 
     }, 
     dataType: "html", 
     url: templateDir + loadUrl, 
     beforeSend: function() { 
      append.hide().append('' + 
       '<div id="temp_load" class="search-loader">' + 
        '<img src="' + templateDir + '/img/load.GIF" />' + 
       '</div>' 
      ).fadeIn(200); 
     }, 
     success: function(data) { 

      $("#temp_load").fadeOut(200); 

      // fix for fast typers 
      results.empty(); 

      var data = $(data); 
      if (data.length) { 
       results.append(data); 
      } else { 
       results.append(nothingFound); 
      } 
     }, 
     error: function(jqXHR, textStatus, errorThrown) { 
      $("#temp_load").fadeOut(200).remove(); 
      console.log(jqXHR + " :: " + textStatus + " :: " + errorThrown); 
     } 
    }); 

});

PHP函数：

<?php 

include_once($_SERVER['DOCUMENT_ROOT'].'/wp-load.php'); 

global $wpdb; 

if(isset($_GET['nameLike']) && strlen($_GET['nameLike']) > 1) : 


    $search = $_GET['nameLike']; 

    $results = $wpdb->get_results($wpdb->prepare(" 
     SELECT ID 
     FROM $wpdb->posts 
     WHERE $wpdb->posts.post_status = 'inherit' 
     AND $wpdb->posts.post_mime_type != '' 
     AND ($wpdb->posts.post_author = 1 OR $wpdb->posts.post_author = 3) 
     AND $wpdb->posts.post_title LIKE %s 
    ", '%' . like_escape($search) . '%' 
    ), ARRAY_A); 


    foreach ($results as $result) : ?> 


     <?php 
      $image = wp_get_attachment_image($result[ID], array(200, 150)); 
     ?> 

     <div class="grid-1-4 clearfix"> 
      <div class="stock-image-select clearfix" data-id="<?php echo $result[ID]; ?>"> 
       <?php echo $image; ?> 
      </div> 
     </div> 

    <?php endforeach; 


else : ?> 

    <div class="grid-10">Your search needs to be at least 2 characters long.</div>   

<?php endif; ?>

如果任何人都可以看到一个明显的错误，请让我知道:)

来源

2014-07-02 lukeseager

您是否尝试过按键或键控？ http://api.jquery.com/keypress/ –

刚刚试过这个，没有运气仍然:( – lukeseager

把一个console.log在绑定中，看看它是否按下按键时触发... $（'something' ）.keyup（function（e）{console.log（'here'）;} ...）;如果它在浏览器的控制台中触发[按CTRL + ALT + I]，那么JS不是问题 –

尝试是这样的

$(document).ready(function() { 
    $('input[name="search_field"]').keyup(function(e){ 
     $(this).text; 
     //process your search 
     }); 
});

当您检测到关键是提出然后采取文字，并进行搜索。

来源

2014-07-02 08:47:21

图像AJAX搜索不适用于Safari

回答

相关问题