javascript - 按下按钮时隐藏的复选框出现(正确)，但再次按下时不会消失-6ren

javascript - 按下按钮时隐藏的复选框出现(正确)，但再次按下时不会消失

转载作者：太空宇宙更新时间：2023-11-03 18:28:24

25

4

这真的很奇怪。其他任何东西(按钮、下拉列表等)都适用于此方法，但不适用于复选框。在我的代码中，出现了一个按钮，当我按下它时，复选框变得可见。但是当我再次按下它时，复选框并没有消失。我发现如果我删除一行，代码似乎可以工作(但文本不是我需要的 float:left)。我怎样才能解决这个问题，使我的格式保持正确？这是需要删除的行:

     input[type=checkbox] {margin: 5px; float:left;  }

这是我的全部代码:

<!DOCTYPE html>
<head>
<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet">
<style type="text/css">
    hidden0001{display:none}
</style>
<style>
</style>
<style id="Styles">
         label { margin: 1px; padding: 0px; float:right;}
         html { margin: 0px; padding: 0px; }
         body {margin: 0px; padding: 0px;}
         p.left { text-align: left; margin: 0px;}
         .image {margin: 5px;}
         .headertext {margin: 5px; margin-left: 5px; margin-right: 5px; }
         .draggable { width: auto; height: auto; position: absolute;} 
         input[type=text] {margin: 5px;}
         input[type=button] {margin: 5px;}
         input[type=checkbox] {margin: 5px; float:left;  }
         input[type=file] {margin: 0px;}
         span {margin: 5px;}
         textarea {margin: 5px;}
         select {margin: 5px;}
         .tablink {float:left; margin: 5px;}
         .ui-tabs {height:40px; vertical-align: central; margin: 2px;}
         .mainheader {margin: 5px;vertical-align: central; padding: 0px; }
         #TabBox {background-color:#fff;padding: 0px;}
         .check { clear: both; float: left; display: block;  }

         .ui-tooltip {z-index:10;font-size:0.875em;margin-left:5px;
                      color:#fff;background-color: #000000;font-family: 'Droid Sans', sans-serif;
         -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px; position: absolute;padding: 5px;
         border:2px solid blue;}
        .tab_box  {width:800px; height:400px; position: relative; }
</style>
</head>
<body style="cursor: auto; ">
<div style="width:100%;height:auto;">
<center>
<div class="maincontainer" style="display: block; ">

               <div id="Builder" style="display: block; opacity: 1; ">
                  <div id="Main">
                     <div class="mainheader changeheader" style="width: 800px; ">
</div>
                     <div id="tabs" class="ui-tabs ui-widget ui-widget-content ui-corner-all" style="width: 800px; display: none; ">
                        <div id="tablinks">
</div>
                     </div>
                     <div id="TabBox" style="width: 800px; ">
<div class="Elements-0 tab_box" id="containment-wrapper-0" style="display: block; ">
                  <div id="draggable_1" class="draggable ui-widget-content ui-draggable" style="left: 30px; top: 60px; ">
<input type="button" value="PUSH THIS BUTTON" class="btn " onclick="ubot.runScript('runthis()')">
</div>
<div id="draggable_2" class="draggable ui-widget-content ui-draggable" style="left: 242px; top: 64px; ">
<hidden0001>
                        <input type="checkbox" id="CheckBox_2" variable="#chbox" fillwith="checked">
<label for="CheckBox_2" style="padding-top:1px;">This is a checkbox</label>
</hidden0001>
</div>
</div>
</div>
                  </div>
               </div>

</div>
</center>
</div>
<!--SCRIPTS-->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js">
</script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js">
</script>
<script>
//Get current tab ID /    Switch Tabs
$(".tablink").live("click", function() {
currentTabID = $(this).attr('id');
$(".tablink").css("border-bottom", "2px inset #000");
$(".tab" + currentTabID).css("border-bottom", "");
$(".tab_box").hide();
$("#containment-wrapper-" + currentTabID).show();
drag();
});
$(function () {
$.widget("ui.tooltip", $.ui.tooltip, {
options: {
content: function () {
return $(this).prop('title');
}
}
});
$(document).tooltip();
});
</script>
<script>
$(document).ready(function(){
  $("#draggable_1").click(function(){
    $("hidden0001").toggle();
  });
});
</script>
</body>
</html>

谢谢你们的帮助，我真的很感谢你们的工作，伙计们!一切顺利，琼斯

最佳答案

我认为您在制作自己的标签时遇到了问题，复选框在哪里。

<hidden0001>....</hidden0001>

只需将此更改为已知标签，如 <span>使用该类名:

<span class="hidden0001"> .... </span>

在你的代码中:

/*CSS*/
.hidden0001{display:none}
/*Jquery*/
$(document).ready(function(){
 $("#draggable_1").click(function(){
   $(".hidden0001").toggle();
 });
});

演示 http://jsfiddle.net/BVmUL/181/

关于javascript - 按下按钮时隐藏的复选框出现(正确)，但再次按下时不会消失，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/20384728/

25

4

0

文章推荐： python - 如何将 models.py 中创建的新类添加到 admin.py (django)

文章推荐： C# 读取 CSV 文件

文章推荐： python - python内存中的对象

文章推荐： c# - 使用 foreach 遍历 IEnumerable 会跳过一些元素

javascript - 为什么我的新内容没有立即在页面上显示/消失，而是在手动刷新后显示/消失？
我使用 vanilla JS 通过 AJAX 向数据库发送请求。数据写入数据库没有问题。在刷新页面之前，我看不到被放入数据库中的内容。当我删除内容时也会发生同样的情况，我必须刷新才能看到内容消失了。
Elixir Phoenix LiveView Echart 消失(消失)
抱歉，这篇文章很长，我试图提供所有信息并解释我已经尝试过的内容。问题: 我将经典的 Phoenix View 放入实时 View 中。虽然一切看起来都很好，但 echart 一完成绘制就消失了。好像
javascript - 单击按钮时选择框出现/消失
搜索了一下，没有找到我要找的东西。我有两个按钮，单击一次即可拉出两个不同的选择框，第二次单击它们就会消失。但是，我希望选择框 1 在单击按钮 2 时消失，反之亦然:选择框 2 将在单击按钮 1 时消失
ios - UILayoutViewController中的滚动时自动布局约束“消失”
我正在尝试使用自动布局使用“浮动”标题构建滚动视图。更确切地说，我正在尝试建立包含几列的日历视图。这些列中的每个列都应具有自己的标题，该标题应浮动在顶部，而该列可以垂直滚动到其下方。如果一切正常，则
jquery - 让具有类别的对象在循环中随机出现/消失
我正在尝试模仿星星背景。星星是在加载时创建并随机散布在整个网站上的。到目前为止我已经调整了一些代码。 var star="•"; var numStars=100; for(var x=1;x•";
jQuery:单击时菜单出现/消失
我查遍了整个网络，但找不到解决方案。我对 jQuery 也很陌生。我的案例: 我有一个导航栏，其中的每个链接都会激活/触发一个megamenu(每个链接都有自己的megamenu)。我需要什么:
android - OnChildClickListener 消失
我有一个可扩展的 ListView ，当我点击一行时，它会触发 onChildClick 或 onGroupClick，具体取决于我点击的是子项还是组。如果我在 xml 布局文件中添加可点击的内容(
ios - NSMutableData 消失
在我的程序中，我有一个 NSMutableData 变量，用于收集来自 http://www.nhara.org/scored_races-2013.htm 的信息。 .大约第三次从网站获取信息后，当
android - Genymotion 消失
我一直在完美地使用 Genymotion，但是从最近几天开始我的 Genymotion 并打开它的 GPS 开始，我的 Genymotion 突然消失了。但是我的 eclipse 显示 Genymot
添加文档类型时 CSS 消失
这个问题不太可能帮助任何 future 的访问者；它只与一个小的地理区域、一个特定的时间点或一个非常狭窄的情况有关，这些情况并不普遍适用于互联网的全局受众。为了帮助使这个问题更广泛地适用，visit
css - 添加到购物车按钮在悬停时立即出现/消失
关闭。这个问题需要debugging details .它目前不接受答案。编辑问题以包含 desired behavior, a specific problem or error, and t
c++ - vector 消失
所以我的 Item::return_all() 有问题，因为我在 main.cpp 中调用它。早些时候我在 read_file() 和 for (auto data : example_item) 中
ios - UITableViewCells 消失
所有 UITableCells 在 UITableView 中滚动和触摸时消失。一切都以编程方式完成，我使用标准的 UITableViewCell 类。我在某处读到包含我的单元格数据的数组可能被清空
ios - UICollectionView 消失
我对 Swift 还很陌生。我的问题是我的 UICollectionView 正在消失。在 Xcode 中，它显示一切就绪，但当我在模拟器或设备上启动时，它消失了，只剩下导航栏和标签栏。有谁知道是什
javascript - 根据单选按钮的状态变化使子内容出现/消失
这是 this one的续题。较早的问题是在复选框上。但是后来我根据要求把check box改成了radio buttons。现在我需要显示子单选按钮并在母单选按钮处于事件状态时更改背景颜色。一旦它
javascript - Canvas 消失
我用 JS 写了一个简单的脚本。当我将它放入 html 文档(在 body 标签的底部)时，它工作正常。当我尝试将它放入外部文档并链接它时，脚本运行但 canvas 元素消失(刚刚检查:当我将脚本放在
jquery - 滚动页面时使元素出现/消失
我正在尝试创建一个带有固定元素的滚动页面，当用户向下滚动页面时，该元素“始终”可见。例如，带有道路背景的汽车图像。因此，当用户向下滚动页面时，汽车看起来就像在路上行驶。虽然汽车出现在道路的顶部，但它必
javascript - 使文本在单击按钮时出现/消失
这个问题在这里已经有了答案: How can I change CSS display none or block property using jQuery? (15 个答案) 关闭 4 年前。
android - 如何避免旧的小部件在主要代码返工期间失败/消失？
我在市场上有一个支持小部件的应用程序。我对应用程序进行了一些重大更改，重新设计了很多内部结构，替换/重命名 Activity 等。其他更改包括从不同的共享首选项键获取小部件配置数据，尽管我已经编写了转
java - fragment 消失
我有一个 fragment alertsfragment.java，它有一个 GridView 布局，当我打开它时，它工作正常，但是当我在其他选项卡之间滑动时，它就消失了。为了解释更多，我有一个 Ac

首页

博学

6Ren·AI

商城

javascript - 按下按钮时隐藏的复选框出现(正确)，但再次按下时不会消失