xioyito / NewBee

A elegance, clean Hugo Theme with high interaction for blogger
MIT License
50 stars 17 forks source link

搜索框优化 #20

Closed db-root closed 1 year ago

db-root commented 1 year ago

这个主题感觉很棒,我在使用的时候感觉搜索框搜索不到内容的时候点击超链接这样搜索并不是很完善,是否可以将search这块儿改为这种点击超链接之后跳转到Google进行搜索。 我更改代码如以下结果:

function search() {
    clearPosts();
    var key = document.getElementById("search-key").value;
    var postCount = 0;

    // 不管是否有搜索关键字,都可以点击超链接进行搜索
    var googleLink = 'https://www.google.com/search?q=' + encodeURIComponent(key);
    var searchBy = 'Search by <a href="' + googleLink + '" target="_blank" class="search-by" >Google</a>';

    if (!key) {
        $(".stip").html(search_nothing + ',' + searchBy);
        $(".at-bottom").hide();
        $(".sbody").show();
        return;
    }

    for (var i = 0; i < postsCount; i++) {
        var postTitle = arrPosts[i].title;
        var postPubDate = arrPosts[i].pubDate;
        var postPlain = arrPosts[i].plain;
        var link = arrPosts[i].link;
        var keyIndex = postPlain.indexOf(key);
        var keyIndexTitle = postTitle.indexOf(key);

        if (keyIndex >= 0 || keyIndexTitle >= 0) {
            var postMark = toMark(postPlain, key);
            var postMark2 = toMarkTitle(postTitle, key);
            postCount++;

            if (postMark || postMark2) {
                addItem(hlHtml(postMark2, key), postPubDate, hlHtml(postMark, key), link);
            }
        }
    }

    if (postCount == 0) {
        $(".stip").html(search_nothing + ',' + searchBy);
    } else {
        var searchResultsText = postCount > 1 ? ' ' + search_results + ', ' : ' ' + search_result + ', ';
        $(".stip").html(search_found + ' ' + postCount + searchResultsText + searchBy);
        $(".sbody-1").append('<div class="at-bottom">' + search_theEnd + '</div>');
    }
    $(".sbody").show();
}
db-root commented 1 year ago

这个主题感觉很棒,我在使用的时候感觉搜索框搜索不到内容的时候点击超链接这样搜索并不是很完善,是否可以将search这块儿改为这种点击超链接之后跳转到Google进行搜索。 我更改代码如以下结果:

function search() {
    clearPosts();
    var key = document.getElementById("search-key").value;
    var postCount = 0;

    // 不管是否有搜索关键字,都可以点击超链接进行搜索
    var googleLink = 'https://www.google.com/search?q=' + encodeURIComponent(key);
    var searchBy = 'Search by <a href="' + googleLink + '" target="_blank" class="search-by" >Google</a>';

    if (!key) {
        $(".stip").html(search_nothing + ',' + searchBy);
        $(".at-bottom").hide();
        $(".sbody").show();
        return;
    }

    for (var i = 0; i < postsCount; i++) {
        var postTitle = arrPosts[i].title;
        var postPubDate = arrPosts[i].pubDate;
        var postPlain = arrPosts[i].plain;
        var link = arrPosts[i].link;
        var keyIndex = postPlain.indexOf(key);
        var keyIndexTitle = postTitle.indexOf(key);

        if (keyIndex >= 0 || keyIndexTitle >= 0) {
            var postMark = toMark(postPlain, key);
            var postMark2 = toMarkTitle(postTitle, key);
            postCount++;

            if (postMark || postMark2) {
                addItem(hlHtml(postMark2, key), postPubDate, hlHtml(postMark, key), link);
            }
        }
    }

    if (postCount == 0) {
        $(".stip").html(search_nothing + ',' + searchBy);
    } else {
        var searchResultsText = postCount > 1 ? ' ' + search_results + ', ' : ' ' + search_result + ', ';
        $(".stip").html(search_found + ' ' + postCount + searchResultsText + searchBy);
        $(".sbody-1").append('<div class="at-bottom">' + search_theEnd + '</div>');
    }
    $(".sbody").show();
}

比如像这样的效果:https://elisky.cn/

xioyito commented 1 year ago

首先非常感谢你的建议。那句话“search by NewBee”想表达的意思是“此搜索功能由NewBee主题提供”,并不是想要提供能够通过其他搜索引擎来搜索关键字的功能。如果用户想要通过搜索引擎搜索关键字,我觉得不如直接打开新标签页来搜索比较好,毕竟每个用户使用的搜索引擎可能都不一样嘛。感谢反馈。