共被编辑 2 次

版本 更新时间 贡献者 编辑原因 操作
#r2 10月10日 十年一个轮回8 修改:正文 查看

前端搜索--匹配内容,输出结果

问题描述

用户通过搜索框搜索道路名称(已通过ajax获取到),从而进行匹配,匹配完成后输出到指定的页面

问题出现的环境背景及自己尝试过哪些方法

相关代码

// 请把代码文本粘贴到下方(请勿用图片代替代码)
html代码

<div class="query">
    <input id="keyword" placeholder="道路名称" type="text">
    <input class="queryButton" type="submit" value="查询">
</div>
<div id="rightQuery">
    <div id="#content_news_list"></div>
</div>

js代码

$(".queryButton").on("click", function (event) {
$("#rightQuery").show();
$("#openButtonRight").hide();
$("#closeButtonRight").show();
event.stopPropagation();
event.preventDefault();
$("input[type=text]").change(function () {
    let searchText = $(this).val();     //获取输入的搜索内容
    if (searchText !== "") {
        if (displayData.roadname) {
            let roadJamSource=searchText.find(displayData.roadname);  //从获取到的信息中匹配输入的搜索内容
            $("#content_news_list").setText(roadJamSource);//如果找到,写入到右侧div中
        }else{
            $("#content_news_list").html("<li>not find</li>")
        }
    }
});

你期待的结果是什么?实际看到的错误信息又是什么?

匹配成功后输出到指定div即可

#r1 10月10日 十年一个轮回8 创建问题 查看

前端搜索--匹配内容,输出结果

问题描述

用户通过搜索框搜索道路名称(已通过ajax获取到),从而进行匹配,匹配完成后输出到指定的页面

问题出现的环境背景及自己尝试过哪些方法

相关代码

// 请把代码文本粘贴到下方(请勿用图片代替代码)
html代码

<div class="query">
    <input id="keyword" placeholder="道路名称" type="text">
    <input class="queryButton" type="submit" value="查询">
</div>
<div id="rightQuery">
    <div id="#content_news_list"></div>
</div>

js代码
$(".queryButton").on("click", function (event) {

$("#rightQuery").show();
$("#openButtonRight").hide();
$("#closeButtonRight").show();
event.stopPropagation();
event.preventDefault();
$("input[type=text]").change(function () {
    let searchText = $(this).val();     //获取输入的搜索内容
    if (searchText !== "") {
        if (displayData.roadname) {
            let roadJamSource=searchText.find(displayData.roadname);  //从获取到的信息中匹配输入的搜索内容
            $("#content_news_list").setText(roadJamSource);//如果找到,写入到右侧div中
        }else{
            $("#content_news_list").html("<li>not find</li>")
        }
    }
});

你期待的结果是什么?实际看到的错误信息又是什么?

匹配成功后输出到指定div即可