javascript - 如何将 ELSE 添加到要追加的 IF 语句

标签 javascript jquery html json

在当前的 DEMO 中,您可以搜索一个或多个值(1001、1002、1003),并且将拉取 JSON 属性功能。

所以如果你搜索:

1001, 1002, 1003

你得到:

RANK_BY_CD: 1001 => 26

RANK_BY_CD: 1002 => 212

RANK_BY_CD: 1003 => 248

var data = [];

    $(document).ready(function () {
    $("#button").click(function (any_function_variable_name) {
        var searchIds = new Set($('#searchBox').val().split(',').map(s => s.trim()));
        data.features.forEach(({ properties: { CDUID, RANK_BY_CD } }) => {
            if (searchIds.has(CDUID)) {
          $("ul")
          .append(`<li> <strong>RANK_BY_CD: </strong>${CDUID} => ${RANK_BY_CD}`);
            } else {
	$("ul")
  	return(`<li> <strong>RANK_BY_CD: </strong>${CDUID} => undefined`);
}
        });
    });
});

    function getdata() {
        var xmlhttp = new XMLHttpRequest();
        var url = "https://api.myjson.com/bins/6oj58";
        //var data = [];
        xmlhttp.onreadystatechange = function () {
            if (this.readyState == 4 && this.status == 200) {
                data = JSON.parse(this.responseText);
            }
        };
        xmlhttp.open("GET", url, true);
        xmlhttp.send();
    }

    getdata();
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<textarea id="searchBox" type="text"></textarea>
    <button id="button">
        Search
    </button>
    <div>
        <ul></ul>
    </div>

我正在尝试添加一个 else 语句,如果您搜索一个不匹配的值,例如:

0001

它将返回:

RANK_BY_CD: 0001 => undefined

我在 if else 语句的 else 部分尝试了 .append、return、document.write,但要么什么也得不到,要么出错。

最佳答案

然后您应该迭代 searchIds 而不是 data。在这种情况下,最好在检索时将数据转换为键/值对。

旁注:我建议使用 fetch API,它比 XMLHttpRequest 使用起来简单得多:

var data = {};

$(document).ready(function () {
    $("#button").click(function (any_function_variable_name) {
        $("ul").empty();
        var searchIds = new Set($('#searchBox').val().split(',').map(s => s.trim()));
        searchIds.forEach(id => 
            $("ul").append(`<li><strong>RANK_BY_CD: </strong>${id} => ${data[id]}</li>`)
        );
    });
});

function getdata() {
    fetch("https://api.myjson.com/bins/6oj58").then(resp => resp.json()).then(resp => {
        data = Object.assign({}, ...resp.features.map(
            ({ properties: { CDUID, RANK_BY_CD } }) => ({ [CDUID]: RANK_BY_CD }))
        );
    });
}

getdata();
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<textarea id="searchBox" type="text"></textarea>
<button id="button">
    Search
</button>
<div>
    <ul></ul>
</div>

关于javascript - 如何将 ELSE 添加到要追加的 IF 语句,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53948578/

相关文章:

html - 如何在子元素(列表中)上将 CSS 字体大小的级联覆盖回默认值

javascript - 不要使用 CSS 和 Javascript 在打印中获取 div 样式

javascript - 未捕获的类型错误 : Cannot read property 'children' of undefined

javascript - jQuery 悬停产生错误 "Uncaught SyntaxError: missing )"

jquery - 将样式设置为表格单元格的动画 div 宽度

jquery - 有没有可能我可以使用 jquery 将某个 html 标记转移到另一个位置?

javascript - jquery slideup 和 bootstrap 的警报(只显示一次)

javascript - 哪种形式的初始化更好?

javascript - 如何在服务器重启后存储带有 Passport 的连接用户?

jquery - 两个固定的 div - 右和左