gpt4 book ai didi

jquery - 如何在 Jquery 中使用隐藏/显示功能?

转载 作者:行者123 更新时间:2023-11-27 22:38:57 24 4
gpt4 key购买 nike

我有一个 HTML 页面,其中包含一个切换按钮和一些下拉项。我的切换按钮就像开关一样。
我需要的??我需要在单击“打开”时隐藏下拉项,并在单击时显示下拉项
开关”。我是 HTML、CSS、JQuery 的新手。这是我的 HTML 文件代码,它只能工作
用于切换。

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"
type="text/javascript"></script>
<script src="jquery/iphone-style-checkboxes.js" type="text/javascript"
charset="utf-8"></script>
<link rel="stylesheet" href="style.css" type="text/css" media="screen"
charset="utf-8" />
<style type="text/css">
body {padding: 10px; }
th {text-align: right;padding: 4px;padding-right: 15px;vertical-align: top; }
.css_sized_container .iPhoneCheckContainer {width: 250px; }
</style>

<script type="text/javascript" charset="utf-8">
$(window).load(function() {
$('.on_off :checkbox').iphoneStyle();
$('.disabled :checkbox').iphoneStyle();
$('.css_sized_container :checkbox').iphoneStyle({
resizeContainer: false, resizeHandle: false
});
$('.long_tiny :checkbox').iphoneStyle({
checkedLabel: 'Very Long Text', uncheckedLabel: 'Tiny'
});

var onchange_checkbox = ($('.onchange :checkbox')).iphoneStyle({
onChange: function(elem, value) {
$('span#status').html(value.toString());

}
});

setInterval(function() {
onchange_checkbox.prop(
'checked', !onchange_checkbox.is(':checked')).iphoneStyle("refresh");
return
}, 2500);
});

</script>
</head>
<body>
<table><tr class="on_off">
<td>
<input type="checkbox" id="on_off" />
</td>
</tr></table>
</body>
</html>

我知道以下函数用于隐藏和显示。

$(document).ready(function(){
$("#hide").click(function(){
$("p").hide();
});
$("#show").click(function(){
$("p").show();
});
});

但是我不明白这个函数是如何在javascript中实现的。
因为以上功能适用于两个按钮,而我只使用一个按钮..
请给我任何提示或指出我错在哪里?....

最佳答案

你可以使用toggle方法:

Display or hide the matched elements.

$("#button").click(function(){
$("p").toggle();
});

或者根据你的标记:

$("#on_off").change(function(){
$("p").css('display', this.checked ? 'block' : 'none');
});

关于jquery - 如何在 Jquery 中使用隐藏/显示功能?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12138043/

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