如何使用 JavaScript (html) 在某个字符出现之前/之后删除所有内容

Posted 2023-03-11

【中文标题】如何使用 JavaScript (html) 在某个字符出现之前/之后删除所有内容

【英文标题】：How to remove everything before/after the occurrence of a certain character using JavaScript (html)

【发布时间】：2014-11-10 15:29:40

【问题描述】：

所以，我有一个“自定义”搜索栏，它可以获取一些 html 代码并将其显示在输入表单下。传入的html是这样的形式：

当我输入“ba”时，我会在搜索栏中得到这个结果：

所以，基本上，我想把“33 | balloon Rides Daily (1)”变成“balloon Rides Daily”我该怎么做？谢谢！

完整代码：

    <form>
        Search:
        <input type="text" id="searchbar">
        <br>
    </form>

    <div id="result"></div>

    <script>
        var term;

        $('#searchbar')
            .bind('keyup', function(e) 
                term = $(this).val();
                document.getElementById("result").innerHTML = "";
                console.log(term);
                getTags();
            );

        function getTags() 
            $.get("myaspscript", 
                needle: term
            , function(data, status) 
                tags = data.split(", ");
                $(result).html(data);
                $($(result).find('ol').get().reverse()).each(function() 
                    $(this).replaceWith($('<ul>' + $(this).html() + '</ul>'))
                )
            );
        
    </script>
</body>

编辑

html 的外观：http://jsfiddle.net/gk2ud9fL/2/

【问题讨论】：

见***.com/questions/9932957/…

【参考方案1】：

更新：鉴于您的 cmets 和对代码的更彻底阅读，您似乎有几个问题。

1) 不要在每次提起键时重新获取列表。它浪费资源。只需获取一次列表，然后从那里开始使用该数据

2) 如果您可以控制返回的数据，那么返回一个包含所有列表项值的数组的 JSON 对象会容易得多。如果不熟悉这些术语，我会让你查一下。

说了这么多，这将适用于您的情况。首先是正则表达式：

/\d+\s\|\s(.*) \(\d+\)/g

这将匹配您想要获得的内容。实施：

// Credit Shog9♦ here: 
// http://***.com/questions/247023/get-an-array-of-list-element-contents-in-jquery
// Parses the list into an array and changes it's values.
var optionTexts = [];
(function changeAndStoreList()
    $("ul li").each(function () 
        var regex = /\d+\s\|\s(.*) \(\d+\)/g;
        $(this).text(regex.exec($(this).text())[1]);
        optionTexts.push($(this).text());
    );
());                   

// Search as we type
$('#searchbar').bind('keyup', function (e) 
    document.getElementById("result").innerHTML = "";
    if ($(this).val() !== "") 
        $("#result").text(search($(this).val(), optionTexts));
    
);

// Simple search funcion
function search(needle, haystack) 
    for (var i = 0; i < haystack.length; i++) 
        if (haystack[i].match(needle)) 
            return haystack[i];
        
    
    return false;

这只是将列表解析为它的值的数组，使其易于使用。然后我们在每次按键时搜索该数组并显示结果。

Here's a fiddle to prove concept

【讨论】：

这确实有效。但是，您知道如何获取 var term = (来自列表中特定项目的文本) 吗？要缩短的文本位于无序列表中。

我将其标记为正确，因为它确实有帮助，但是，有一件小事。我想从每个列表项中删除这些字符，而不仅仅是正在搜索的那个。所以整个列表将是缩短的字符串。任何想法

再次，查看更新。请在以后的问题中更加小心地提供这些详细信息。

再次感谢。我当时以为我提供了足够的细节，但现在我明白了它是如何被误解的。会努力的。

【参考方案2】：

如果可以，请发布要引入的实际 html 代码。否则，请针对列表中的每个项目执行此操作：

将 html 中包含的实际字符串与 html 分开，只需使用 拆分('char'); 获取现在分离的字符串并使用 | 再次拆分它和 ( 输出位于结果数组中的正确字符串。

同样，这是没有看到 html 代码。

【讨论】：

我没有代码，但字符串在有序列表中（我在代码中将其转换为无序）。我更新了一张图片