Question

我创建了一个网页，我希望用户能够搜索存储在CSV文件中的单词/术语，如果找到该术语，则会返回该行条目的完整行并显示给用户（理想情况下是表格格式，否则textarea会这样做）。

但是我需要使用AJAX来做这件事，我也不能使用PHP（不幸的是，否则我不会问这个问题）。

到目前为止，我有一个表格用于表格/输入/按钮，而且我还有代码来读取文件，但是我把它们放在一起有点困难。我知道这应该是一件容易的事，但我花了很多时间浏览教程和在线问题，但却找不到类似的东西。

如果有人知道任何涵盖此内容的教程，或者可以帮助解决下面的代码，我们将不胜感激。

  <table>        
     <tr><td>Enter Search Term:
     <input type="text" name="searchword" />
     <input type="button" name="searchbutton" value="Search" onclick="contentDisp();">
     </td></tr>
     <tr><td><textarea id="contentArea" rows="40" cols="60"></textarea></td></tr>
    </table>  //currently using text area but ideally this would be displayed in a table

    <script type="text/javascript">
    function contentDisp()
        {
            $.ajax({
                url : "file.csv",
                success : function (data) {
                    $("#contentArea").html(data); // I THINK SOMETHING NEEDS TO GO IN HERE, WHICH WILL GRAB THE SEARCH TERM ABOVE AND THEN ONLY DISPLAY FILE CONTENTS USING THAT TERM, POSSIBLY 'CONTAIN' */
                }
            });
        }  
    </script>

Answer 1

可以通过JavaScript使用一些strpos和indexOf函数严格执行此操作（indexOf是起始点，而另一个将查找字符串分隔符）。

如果您对此感到满意，也可以使用php完成任务，如果您受到域源限制的限制，请查看JSONP，它代表带有填充的JSON - 这基本上意味着您需要将结果包装在JavaScript函数中。

祝你好运。

Answer 2

用户正则表达式，用于查找字符串并解析CSV数据中找到的行。

http://www.w3schools.com/jsref/jsref_obj_regexp.asp

Answer 3

HTML

<input type="text" id="text" />
<input type="submit" id="btnsubmit" />

脚本

$(function(){
$('#btnsubmit').on('click', function(){
    var csv = $.ajax('text.csv');
    csv.done(function(data){
        var str = data.split(',');
        var value = $('#text').val();
        $.each(str, function(index, item){
            if(item.match(value)){
                console.log(item) //Output
            };
        })
    })  
})
});

CSV

Presidency ,President ,Wikipedia Entry,Took office ,Left office ,Party ,Portrait,Thumbnail,Home State

Answer 4

当javascript已经有用于匹配字符串的内置函数时，为什么要使用strpos和indexOf？

http://jsfiddle.net/AWZg8/

使用AJAX进行HTML / Javascript搜索功能

4 个答案: