gpt4 book ai didi

javascript - 根据复选框的选中状态和输入文本值隐藏/显示段落

转载 作者:行者123 更新时间:2023-11-27 22:55:19 25 4
gpt4 key购买 nike

共有 4 个段落、一个空白文本字段、1 个复选框和一个按钮。

我希望当我选中复选框并在字段中写下“1”时隐藏 1 个段落,当我选中复选框并写下 2 时隐藏 2 个段落,等等。

HTML:

<p class="p1">P1</p>
<p class="p2">P2</p>
<p class="p3">P3</p>
<p class="p4">P4</p>

<input id="txt" type="text" name="fld" value="" /> <br /> <br />

P <input id="pcheck" type="checkbox" name="pcheckbox" /> <br /> <br />

<input id="disapp" type="button" value="Disappear" />

JavaScript:

$(document).ready(function(){
$("#disapp").click(function() {
if(($("#pcheck").is(":checked")) && ($(#txt).val()=="1") {
$(".p1").hide();
}
});
});

我也尝试过这样格式化:

$(document).ready(function(){
$(disapp).click(function() {
if(($pcheck.checked) && ($txt.value()=="1")) {
$p1.hide();
}
});
});

而且我不知道哪种格式更正确,也不知道如何使其发挥作用。

最佳答案

使用文本字段值创建选择器并使用 toggle() 切换可见性 在本例中带有 bool 参数的方法 is() 方法返回 bool 值,可以使用。

$(document).ready(function() {
$("#disapp").click(function() {
$(".p" + $('#txt').val().trim()).toggle(!$("#pcheck").is(":checked"));
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p class="p1">P1</p>
<p class="p2">P2</p>
<p class="p3">P3</p>
<p class="p4">P4</p>

<input id="txt" type="text" name="fld" value="" />
<br />
<br />P
<input id="pcheck" type="checkbox" name="pcheckbox" />
<br />
<br />

<input id="disapp" type="button" value="Disappear" />

<小时/>

您的代码有各种错误:在第一种情况下,文本框选择器周围缺少引号,并且还缺少一个附加括号。像 if($("#pcheck").is(":checked") && $("#txt").val()=="1") 一样更改它。在第二种情况下,所有变量都未定义,我在任何地方都看不到它的定义。

关于javascript - 根据复选框的选中状态和输入文本值隐藏/显示段落,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37673924/

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