如果输入值等于Div的ID，则显示它

Question

我正在尝试创建简单的字典网页，我需要显示某些 DIV 在 INPUT 中输入的词的翻译和描述。

我已经为此创建了一些简单的 JavaScript，但我想使用大约 50 个单词而不打算为此创建 50 个脚本 :D。

var match = 'cat',
    input = document.getElementById('searchbox'),
    div = document.getElementById('cat');
    input.onkeyup = function(e){
    if (this.value == match){
        div.style.display = 'block';
    }
    else {
        div.style.display = 'none';
    }
};

相反，我想使用不同的东西。我的目标是实现类似的目标——如果在 INPUT 中输入的文本等于我的 DIV 的 ID，而不是显示它。

例如，如果访问者在 INPUT 中键入 "CAT"，则显示 DIV 和 "CAT" ID 等等。一个脚本而不是 50 个。

Answer 1

您可以使用 typeof 关键字检查元素是否存在，如下所示：

var input = document.getElementById('searchbox');
var div = document.getElementById(input.value);
if(typeof(div) !=== 'undefined') {
    div.style.display = 'block';
}

Answer 2

您可以像这样在 javascript 中编写函数，然后单击按钮调用该函数。

<script type="text/javascript">
        function fSDiv(var txt,var EId)
        {
            if(document.getElementById(EId).value === txt)
             {
                document.getElementById(EId).style.display = "block";
             }
        }
</script>

如果输入值等于Div的ID，则显示它

If input value equals to Div's ID, then show it

javascript

if-statement

show