0

我正在使用以下使用 Jquery Auto Complete 的自动完成插件。它运行良好并且完全符合我的需要,但我的问题是我的 JSON 文件有数千个带有描述和图像的产品。许多图像已关闭并且无法正常工作。

有谁知道如何用一般的本地图像替换那些损坏的图像链接?我无法手动进入 JSON 文件并替换这些图像,因为这需要数周时间。

我看着这个但没有帮助:“http://stackoverflow.com/questions/92720/jquery-javascript-to-replace-broken-images”

很感谢任何形式的帮助。

这是 FoxyComplete 的 JS 和完整脚本的链接(抱歉无法让 JsFiddle 工作——http : //www.bcreatives.com.au/wp-content/uploads/dev/foxycomplete-local/):

(function($) {
$(document).ready(function() {

    $( '#s' ).each( function(){
    $(this).attr( 'title', $(this).val() )
      .focus( function(){
        if ( $(this).val() == $(this).attr('title') ) {
          $(this).val( '' );
        }
      } ).blur( function(){
        if ( $(this).val() == '' || $(this).val() == ' ' ) {
          $(this).val( $(this).attr('title') );
        }
      } );
    } );

    $('input#s').result(function(event, data, formatted) {
        $('#result').html( !data ? "No match!" : "Selected: " + formatted);
    }).blur(function(){     
    });

    $(function() {      
    function format(mail) {
        return "<a href='"+mail.permalink+"'><img src='" + mail.image + "' /><span class='title'>" + mail.title +"</span></a>";         
    }

    function link(mail) {
        return mail.permalink
    }

    function title(mail) {
        return mail.title
    }

    $("#s").autocomplete(completeResults, {
        width: $("#s").outerWidth()-2,          
        max: 5,         
        scroll: false,
        dataType: "json",
        matchContains: "word",
        parse: function(data) {
            return $.map(data, function(row) {
                return {
                    data: row,
                    value: row.title,
                    result: $("#s").val()
                }
            });
        },
        formatItem: function(item) {                
            return format(item);
        }
        }).result(function(e, item) {
            $("#s").val(title(item));
            //location.href = link(item);
        });                     
    });

});
})(jQuery);
4

1 回答 1

1

我相信您链接的 SO 问题的公认答案应该有效。只需将您的format功能替换为以下内容:

function format(mail) {
    return "<a href='"+mail.permalink+"'>" +
        "<img src='" + mail.image + "' onerror='this.src=\'/img/error.jpg\'' />" +
        "<span class='title'>" + mail.title +"</span></a>";         
}

并确保您有一个名为/img/error.jpg, natch 的图像。

于 2012-09-19T23:16:58.760 回答