gpt4 book ai didi

javascript - 为什么 jquery 和 if 语句不能一起工作?

转载 作者:行者123 更新时间:2023-11-30 09:32:22 26 4
gpt4 key购买 nike

我的代码本应在加载时隐藏多个 div,但由于某种原因,当我输入本应显示一个 div 的代码时,什么也没有发生。请告诉我为什么我的代码中的 jQuery 不能与我的 if 语句一起使用。

这是 java-script/jQuery 和 HTML(以防万一)

var code = $("#code");

function onstart(){
$("#superfoods").hide();
$("#fakemedia").hide();
$("#dropbear").hide();
}

function checkcode(){
if (code == "superfoods")
{
$("#superfoods").show();
}
else if (code == "fakemedia")
{
$("#fakemedia").show();
}
else if (code == "dropbear")
{
$("#dropbear").show();
}
else {
document.alert( code + "is not a valid imput.")
}
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body onload="onstart()">
<input id="code"><button onclick="checkcode()">search for level</button>
<div id="superfoods">
<a href="superfoods.html"><img src="super-food-400x400.jpg"></a>
</div>
<div id="fakemedia">
<a href="fakemedia.html"><img src="fakemedia.png"></a>
</div>
<div id="dropbear">
<a href="dropbear.html"><img src="drop-bearfgh.jpg"></a>
</div>
</body>

最佳答案

注意:- 在您的代码中,您试图将对象 (code) 与字符串值进行比较,因此您的代码不起作用。

所以

var code = $("#code");// this is an object

需要:-

var code = $("#code").val();// this is a string now

但是既然你使用的是 jQuery,这个解决方案怎么样:-

$(document).ready(function(){

$("div").hide();// hide all divs

var ids=[];//create an id's array

$('div').each(function(){
ids.push($(this).attr('id')); // get all div id's and push them to array
});

ids = ids.filter(Boolean); // remove empty+undefined values from array

$('button').on('click',function(){//on click of button

var code = $('#code').val();// get text-box value

if ($.inArray( code, ids )>-1){ // if text-box value exist in array

$("#"+code).show(); // show corresponding div

}else {

alert( code + "is not a valid imput."); // else alert

}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
<input id="code"><button>search for level</button><br/><br/>
<div id="superfoods">
<a href="superfoods.html"><img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTrfTcZ0t3zjzHrGzCiaoI9X94WB-fjDesGNNgjPI4W9bZZFHVf"></a>
</div>
<div id="fakemedia">
<a href="fakemedia.html"><img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcR-nmxPn405_hKrvlT8tOghIpl8yQcMMJnuSYuExWgBW4N6TmUn"></a>
</div>
<div id="dropbear">
<a href="dropbear.html"><img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRGqGpDhUX8weC_xIjO_COdt4F03dA58e5feBQw48VuZ6diJQXj"></a>
</div>
</body>

注意:- 此代码具有优势,它适用于增加的 div 数量。 (只要确保每个 div 的 id 必须是唯一的)

关于javascript - 为什么 jquery 和 if 语句不能一起工作?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45498358/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com