Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/395.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript jQuery包含完整的链接_Javascript_Jquery_Jquery Ui - Fatal编程技术网

Javascript jQuery包含完整的链接

Javascript jQuery包含完整的链接,javascript,jquery,jquery-ui,Javascript,Jquery,Jquery Ui,因此,我尝试在catcomplete结果中使用HTML链接,但jquery会自动将HTML代码转换为文本,如图所示: 我的jQuery代码是: $( "#global-search" ).catcomplete({ delay: 0, source: "globalsearch.php" }); 请不要告诉我使用select:function事件,ui{ window.location.href=ui.item.value; },因为它在使用ajax时只工作一次,我真的不知道为

因此,我尝试在catcomplete结果中使用HTML链接,但jquery会自动将HTML代码转换为文本,如图所示:

我的jQuery代码是:

$( "#global-search" ).catcomplete({
    delay: 0,
    source: "globalsearch.php"
});
请不要告诉我使用select:function事件,ui{ window.location.href=ui.item.value; },因为它在使用ajax时只工作一次,我真的不知道为什么,但它就是不工作,昨天我在这里问了一些问题,问如何修复它,没有人帮我

所以,在html转换成文本后,我如何向结果中添加html超链接

globalsearch.php:

请看一看。您将看到,他们已将_renderItem方法替换为自定义方法。您需要执行相同的操作来覆盖项目的显示方式

$('#global-search').data( "autocomplete" )._renderItem = function( ul, item ) {
  return $( "<li>" )
    .data( "item.autocomplete", item )
    .append((item.link) ? "<a href='" + item.link + "'>" + item.label + "</a>" : "<a>" + item.label + "</a>" )
    .appendTo( ul );
};
在没有看到globalsearch.php的输出的情况下,我无法确切地告诉您如何设置它,但基本上您希望向返回的JSON添加一个链接属性,如果该链接存在,请将该链接作为其href打印锚定


如何处理选择链接与外部链接,留给操作练习。

来自autocomplete小部件文档

与您使用的变体无关,标签始终被视为 文本如果希望标签被视为html,可以使用Scott González的html扩展。演示都集中在不同的变体上 选择源代码-查找与您的用例匹配的源代码,然后 查看代码

Scott González的html扩展是。我还发布了下面的代码

/*
 * jQuery UI Autocomplete HTML Extension
 *
 * Copyright 2010, Scott González (http://scottgonzalez.com)
 * Dual licensed under the MIT or GPL Version 2 licenses.
 *
 * http://github.com/scottgonzalez/jquery-ui-extensions
 */
(function( $ ) {

var proto = $.ui.autocomplete.prototype,
    initSource = proto._initSource;

function filter( array, term ) {
    var matcher = new RegExp( $.ui.autocomplete.escapeRegex(term), "i" );
    return $.grep( array, function(value) {
        return matcher.test( $( "<div>" ).html( value.label || value.value || value ).text() );
    });
}

$.extend( proto, {
    _initSource: function() {
        if ( this.options.html && $.isArray(this.options.source) ) {
            this.source = function( request, response ) {
                response( filter( this.options.source, request.term ) );
            };
        } else {
            initSource.call( this );
        }
    },

    _renderItem: function( ul, item) {
        return $( "<li></li>" )
            .data( "item.autocomplete", item )
            .append( $( "<a></a>" )[ this.options.html ? "html" : "text" ]( item.label ) )
            .appendTo( ul );
    }
});

})( jQuery );

在我看来,你想把一个圆钉子装进一个方孔里。找到一个专为您所需而设计的插件。您是否可以链接到完整的文档?我用谷歌找不到它。@AaronKurtzhals它和catcomplete一起工作吗?我用globalsearch.php outputIt的图片更新了这篇文章,它与autocomplete一起工作,所以它应该与catcomplete一起工作。你试过了吗?我怎么用?我试着打开控制台,执行,看看会发生什么,什么都没有改变。。。它与catcomplete一起工作吗@_@@SergioToledoPiza在我的答案底部看到我的编辑。我不确定它是否会起作用;我正在跟踪文档。
$( "#global-search" ).catcomplete({
    delay: 0,
    html: true,
    source: "globalsearch.php"
});