为什么我的toggle ()的两个选项在执行？
toggle()是一个常用的JavaScript方法，用于切换元素的显示和隐藏状态。它接受一个可选的布尔参数，用于指定元素是否应该被显示或隐藏。如果没有提供参数，则toggle()方法会根据元素的当前状态进行切换。
当你的toggle()方法的两个选项在执行时，可能有以下几个原因导致问题：
- 参数错误：首先，你需要确保toggle()方法的参数正确。它应该是一个布尔值，用于指定元素是否应该被显示或隐藏。例如，如果你想隐藏一个元素，你可以使用toggle(false)或toggle()，而如果你想显示一个元素，你可以使用toggle(true)。
- 元素不存在：如果你的toggle()方法的选项没有执行，可能是因为你指定的元素不存在于DOM中。在执行toggle()方法之前，你需要确保目标元素已经正确地加载到页面上。
- 事件绑定问题：如果你的toggle()方法没有执行，可能是因为你没有正确地绑定事件。你需要确保在适当的时机调用toggle()方法，例如在点击按钮或其他交互事件发生时。
- CSS样式问题：如果你的toggle()方法没有改变元素的显示状态，可能是因为CSS样式的问题。你需要检查元素的CSS属性，例如display属性是否正确设置为none或block来控制元素的显示和隐藏。
总结起来，当toggle()方法的两个选项没有执行时，你需要检查参数是否正确、元素是否存在、事件是否正确绑定以及CSS样式是否正确设置。如果问题仍然存在，可能需要进一步调试和排查代码。
相关·内容
我是Ionic的初学者，在阅读关于的文档时，我注意到每个布局都有两个选项: CSS或JavaScript。
例如，要制作一个切换按钮，我可以使用CSS选项：
<label class="toggle">
<input type="checkbox">
<div class="track">
<div class="handle"></div>
</div>
</label>
..。或
浏览 1提问于2015-04-05得票数 2
回答已采纳
2回答
我有以下几个简单的选项卡：
<div class="ftabs">
<ul id="tabs" class="tabs nav nav-tabs nav-justified" data-tabs="tabs">
<li id='an'><a href="#anag" data-toggle="tab"><h3>Dati Anagrafici</h3></a
浏览 1提问于2013-12-11得票数 2
回答已采纳
2回答
正如在这个jsFiddle中所演示的，我有一个带有两个下拉列表的导航条。第一个下拉列表中的链接触发一个JS单击事件，我在其中手动显示第二个下拉列表。它可以工作，除了显示后，第二个下拉自动和立即隐藏。我添加了一个警告，让您在第二个下拉列表隐藏之前有时间查看它。
复制/粘贴JsFiddle代码：
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navb
浏览 7提问于2013-09-16得票数 0
回答已采纳
设置键盘布局并使用此命令进行切换之后
setxkbmap -option grp:switch,grp:lwin_toggle,grp_led:scroll us,it
一切都很好(两个布局us和it，用左超级键在它们之间切换)，但是当我有我们的布局并且一直按右键时，布局切换到它，直到我释放它，有人知道为什么会这样，以及如何修复？
更新：
我意识到"grp:switch“选项造成了问题。正确的命令是
setxkbmap -option grp:lwin_toggle us,it
浏览 0提问于2012-07-13得票数 0
尝试在新的UI页面上执行一个简单的测试。它有两个选项卡：tab-pay和tab-vaca。我可以使用cy.get(li:tab-vaca').focus()来访问此选项卡。那么，我如何验证(断言)它一直处于活动状态？如果可能的话，我可以稍后通过toggle切换到另一个选项卡吗？谢谢。
浏览 6提问于2021-03-08得票数 0
回答已采纳
我很难理解如何:应该设置宿主元素的样式
例如：
// toggle.component.html
<p>toggle works!</p>
//toggle.component.scss
:host {
background-color: rgba(255, 0, 0, 0.3);
}
这个背景色是不会显示的，除非我在它上面添加了任何显示属性，比如block或inline-block，尽管这个元素显然占用了包含p元素的空间
这给我带来了很多困惑，特别是当我必须在不同的组件中设置相关内容的样式时(例如:我有一个包含其他子自定义组件的组件表，比如table-row和ta
浏览 9提问于2020-03-15得票数 0
我的页面上有两个引导选项卡组件。
第一个有两个制表符，第二个有三个。
简化的代码如下。
<div class="col-md-12">
<ul id="tab1" class="nav nav-tabs" role="tablist">
<li role="presentation" class="active"><a href="#taba" role="tab" data-toggle="ta
浏览 2提问于2015-12-19得票数 1
回答已采纳
2回答
我正在尝试使用我在stackoverflow上找到的fadein+slidedown脚本。
$('#topmenu').animate({
"height": "toggle",
"opacity": "toggle"
}, "slow");
$('.post').delay(1000).animate({
"height": "toggle",
"opacity": "toggle"
浏览 0提问于2013-02-10得票数 0
回答已采纳
我的目标是在我的iframe (其中包含一个日历)的两边各有一个按钮，可以在单个iframe中来回切换日历#1和日历#2。
有什么建议吗？
|arrowLeft| |-----Iframe-------| |arrowRight|
代码在中可以工作，但是当我把所有代码放到我的网站上时就不能工作了。
为什么会这样呢？
HTML:
<p id="toggle">
<span> Left </span>
<span> </span>
</p>
<div id="left"> <
浏览 0提问于2013-03-29得票数 1
回答已采纳
我有一个Rails模型，它有一个简单的布尔属性。当用户单击视图中的复选框时，我试图在后台更新该属性。我相信我已经正确地配置了AJAX和控制器/路由器，但是当我按下按钮时，AJAX的错误函数就会触发，而不是成功的。
我不知道从哪里出发，没有任何有用的信息，我可以从错误中提取。
config/routes.db
...
post "/task_toggle" => "tasks#toggle", :as => "task_toggle"
...
tasks_controller确实存在，并且有一个切换方法。
这是身体末端的javascri
浏览 0提问于2013-11-29得票数 0
我有一个主组件，它调用一个子组件，这是一个切换面板，当我激活切换时，它会发出切换的值(true或false) toggle-pannel.component.ts @Output() toggleChange = new EventEmitter<boolean>();
onChange(event: MatSlideToggleChange) {
this.toggle = event.checked;
this.toggleChange.emit(this.toggle);
} 当我以这种方式使用这个组件时： main.component.html
浏览 31提问于2020-06-15得票数 0
回答已采纳
:*:pl::pleaseHelpMe ; hotstring
:*:rf::reallyConfused ; hotstring
toggle := 0
\::
if (toggle = 0)
{
Run "https://www.google.com.sg/"
}
return
以上代码不适用于击键“\”
但是，下面的代码不需要热字符串即可工作。
toggle := 0
\::
if (toggle = 0)
{
Run "https://www.google.com.sg/"
}
return
为什么是这样？我如何绕过它，使用我的热字符串和
浏览 2提问于2017-02-01得票数 2
回答已采纳
我正在尝试从后台加载内容脚本。执行函数在图标单击块中工作，但我无法触发自动加载部分
var toggle = false;
//Works
chrome.browserAction.onClicked.addListener(function(tab) {
toggle = !toggle;
if (!toggle){
chrome.browserAction.setIcon({path: "enabled.png"});
}else{
chrome.browserAction.setIcon({path: "d
浏览 0提问于2016-01-28得票数 1
回答已采纳
我有两个标签：
我的父选项卡包含一个汽车列表。
“我的孩子”选项卡包含汽车详细信息、性能、优惠
根据显示父选项卡的不同，我试图显示不同的数据。
预期结果:
parent tab
car one | car two
child tab
car details | performance | offers
结果显示在这里
tabs.html
<!-- parent tab -->
<ul class="nav nav-tabs">
{% for car in cars %}
{% if forl
浏览 1提问于2017-03-15得票数 0
我在页面上有这两个div，在它们下面有两个按钮，分别控制、隐藏和显示它们。
<div class="threeSixtyContainer">
<div class="toggle360" style="display: block;" id="Blue">Im Blue</div>
<div class="toggle360" style="display: none;" id="Red">Im Red</d
浏览 2提问于2013-12-17得票数 0
回答已采纳
我试图添加到Rails视图的链接，以便在单击布尔字段时将其设置为true。在控制器(present_controller.rb)中，我有以下代码：
def taken_toggle
@matching = Present.find(params[:id])
@matching.taken = true
@matching.save
end
在关联的视图中，我有以下代码：
<%= link_to "I want to buy this present", :url => {:action => "taken_toggle", :id
浏览 2提问于2011-01-30得票数 4
回答已采纳
给出使用AngularJS 1.2 rc3：的测试用例(重复如下)
1.
<li ng-init="toggle1 = false">
ng-if toggle1: {{ toggle1 }}
<p>
<button ng-if="!toggle1" ng-click="toggle1 = true">Turn On</button>
<button ng-if="toggle1" ng-click="toggle1 =
浏览 2提问于2013-11-06得票数 34
回答已采纳
4回答
我的引导标签窗格内容有一个很大的问题。
<ul class="nav nav-pills nav-justified">
<li class="active"><a data-toggle="tab" href="#masery1">Mastery Page 1</a></li>
<li><a data-toggle="tab" href="#masery2">Mastery Page 2</a>
浏览 5提问于2016-01-05得票数 2
回答已采纳
我试图使用Ajax加载给定选项卡的内容。
我在服务器上呈现的第一个选项卡是活动的，其他选项卡是我使用Ajax激活和加载的。
我已经隔离了这个问题(没有Ajax) 。
HTML：
<h1>Hello, tabs!</h1>
<div>
<ul class="nav nav-tabs" role="tablist">
<li role="presentation" class="active"><a href="#home" a
浏览 4提问于2015-10-30得票数 3
回答已采纳
1回答
我有下面的代码，在div里面有两个ul each，每个都有导航、导航药片、导航堆叠类。
<div >
<ul class="nav nav-pills nav-stacked ">
<li class="active"><a href="#allSection" data-target="#allSectionOptions" data-toggle="tab">All</a></li>
&l
浏览 3提问于2015-11-06得票数 0
回答已采纳
3回答
我有一个由3个部分组成的symfony页面(我使用标签来显示每个部分)，这里是导航菜单。
<ul class="nav nav-tabs centered">
<li class="active">
<a href="#fiche_patient" data-toggle="tab"> {{ 'fiche_pharmacie'|trans }}</a>
</li>
<li>
<a href="#my_team2
浏览 10提问于2019-07-11得票数 0
回答已采纳
我已经读了很多类似的问题，但我找不到我的答案…使用以下代码，我可以打开和关闭我的图表：
<h6 class="toggle-trigger"><a href="#">Chart 3</a></h6>
<div id="Chartspace3" class="toggle-container"></div>
我想要做的是，当点击“图表3”时，下面的两个div如下所示：
<h6 class="toggle-trigger"><
浏览 0提问于2011-11-11得票数 0
回答已采纳
我正在创建一个我希望能够启用/禁用的chrome扩展。我成功地制作了一个弹出窗口。问题是，如果我重新加载扩展(或者用户最初下载它)，我的内容脚本默认为off。我可以只在manifest.json中注入内容脚本，但这会导致为任何新选项卡注入内容脚本--这是我不想要的。其行为应该是，如果您下载/重新加载扩展，它在默认情况下是打开的，但是您可以启用它/禁用它，这适用于每个新选项卡。我尝试过在background.js中进行初始化，但是在启动时没有调用它。
manifest.json
{
"manifest_version": 2,
"name": "R
浏览 1提问于2016-05-25得票数 0
2回答
我有以下问题。当我试图在ASP.Net MVC 5中添加一个新主题时，我的Navbar就会崩溃。当我使用标准引导时，它会工作。我不知道为什么不起作用。
这是我的BundleConfig：
bundles.Add(new StyleBundle("~/Content/css").Include(
"~/Content/bootstrap-lumen.css",
"~/Content/site.css"));
这是标准MVC _Layout.cshtml页面：
<div c
浏览 2提问于2018-01-28得票数 6
回答已采纳
2回答
我正在构建一个带有Rails 4和Bootstrap 3的web应用程序。
在其中一个页面中，我有以下
<ul class="nav nav-tabs" role="tablist">
<li role="presentation" class="active"><a href="#profile" aria-controls="profile" role="tab" data-toggle="tab"><span c
浏览 8提问于2015-10-23得票数 1
回答已采纳
我试图使用两个切换按钮的值来确定下一步要打开的表单。
目前，我只开发了一种形式，但两个按钮的组合将导致更多。我还想说明是否选择了无效的组合。
下面是我处理代码的地方：
Public Function Select_Form()
Dim PolForm As Integer
Dim SchAction As Integer
PolForm = Forms("Home").Toggle39.OptionValue
SchAction = Forms("Home").Toggle47.OptionValue
If PolForm = 1 And SchActio
浏览 0提问于2018-02-02得票数 0
回答已采纳
因此，我在页面顶部有两个导航选项卡，用于在两个视图之间切换：
<ul class="nav nav-tabs">
<li class="active"><a data-target="#first-tab" data-toggle="tab">FOO tab</a></li>
<li><a data-target="#second-tab" data-toggle="tab">BAR Tab</a>
浏览 1提问于2016-06-28得票数 3
回答已采纳
1回答
我把我的mat-datepicker放在页面上的两个地方。当我点击一个地方时，它会打开一个相反的地方。我怎么才能修复它呢？我有两个不同的组件与mat-datepicker，但它打开不同。也许问题是我模仿点击一个组件？但是为什么它会打开另一个呢？下面是代码
打开此处：(child.components.html)
<mat-form-field appearance="fill">
<input matInput [matDatepicker]="picker">
<mat-datepicker-toggle
浏览 27提问于2021-06-09得票数 0
回答已采纳
3回答
我试图执行两个函数，但它只执行第一个函数。我认为，当我更改HTML变量值时，javascript将停止它的执行。
这是我正在执行的代码: HTML：
<div class="funcion" onclick="country_function();setGeo(1)">
JavaScript：
function country_function(){
region_hide();
class_hide();
country_show();
};
function country
浏览 3提问于2018-06-12得票数 0
回答已采纳
我刚刚开始学习Javascript和jQuery (1天内！)昨天我遇到了一个问题，我终于解决了，但不知道为什么改变会奏效。
在.change TLDR中，为什么 .click 通过id标记触发切换/复选框，而.click不触发？
更详细的解释如下：
我希望了解原因，并找出我所做的是否真的是解决我遇到的问题的正确方法。
我正在尝试创建一个可以打开和关闭的项目列表，并通过AJAX更新后端。当我构建两个示例列表时，当我单击一个按钮时，它会切换所有的按钮。
我是通过类调用的(并不是唯一的)，所以我将每个id移动到一个唯一的id中，然后jQuery .click函数停止工作。几个小时后，我的头靠在墙上
浏览 1提问于2020-04-02得票数 1
回答已采纳
我目前有类似这样的东西
文件名: notes.html
{% load staticfiles %}
<script src="{% static "bootstrap/js/Notes.js"%}"></script>
<div class="pure-container" data-effect="pure-effect-slide" style="height: 10px">
<label class="pure-toggle
浏览 22提问于2017-02-22得票数 1
回答已采纳
1回答
在初始加载时，两个选项卡的内容显示在网页上，一旦第一次单击选项卡，它们就开始按预期工作。
对为什么会发生这种事有什么想法吗？
这是我的html
<div id="userFunctions" style="display: none;" >
<h2 id="welcome"></h2>
<button id="btnChangeUser" class="btn btn-primary" style="display: none;">Chan
浏览 2提问于2017-04-27得票数 0
回答已采纳
我试图切换一些文本，问答风格与问题作为一个按钮，将显示其答案时，点击。当CSS没有加载目标元素以显示:none时，它的功能很好。
但是，我希望默认情况下隐藏元素，直到单击按钮为止。由于某些原因，js函数在以这种方式加载页面时无法工作。有人知道为什么吗？
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="sample.css" media="screen" /&g
浏览 0提问于2014-03-03得票数 0
回答已采纳
在linux上使用emacs 23.3.1的两个相关问题：
首先，为什么我不能使用setq将show-trailing-whitespace的值设置为t，如下所示？当我把setq版本放到我的.emacs中时，它不会改变这个值(从功能上和使用M-x describe-variable都可以看到)。
(setq show-trailing-whitespace t) ; Does not change variable value or give error
(custom-set-variables ; Sets show-trailing-whitespace a
浏览 0提问于2012-07-28得票数 12
回答已采纳
我有一个简单的设置:两个不同值的按钮。我希望使用jquery中的.each()函数向每个按钮添加一个单击事件侦听器，这些按钮只记录每个按钮的值。但是在使用.each()时，jquery会覆盖上一个按钮的单击处理程序。这给我留下了两个问题：
为什么？如何将单个事件侦听器添加到jquery对象集合中？
见下面的代码
<html lang="en">
<head>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></s
浏览 2提问于2021-01-08得票数 1
回答已采纳
1回答
关于托格勒的问题
、、
希望你们都没事..。
我在用一个简单的开关来转换Y轴.
我为我的第一幕工作，但我试图保持这个设置贯穿所有的场景，因此，为什么下面的脚本没有被破坏的负载。
虽然它对第一个场景还不错，但是为了帮助我调试它，我试图让它的值显示在控制台上-- InvertYCheck()函数--但是它只显示一次控制台文本，但是即使在Update()函数中添加了if状态，它也不会再次更新(显示新值)。
因此，从这一点来看，尽管它能够检查并取消选中游戏中的切换，但它的值只会在您第一次单击它时更新。
基本上，我想要的是用户能够在训练中选择Y轴的方向(场景1)，然后保留这个值(但不是UI切换)，从而成为整个游戏的设置。
从代
浏览 0提问于2017-05-20得票数 0
2回答
在下面的代码中，我试图初始化两个选项卡控件(actions-power和actions-access)，但是初始化只对第一个选项卡控件进行，而不是同时对两个选项卡控件进行初始化。我是怎么修好它的？
<div id="action-tabs">
<ul class="tabs" id="actions-power">
<li class="active"><a href="#action-power_cycle" data-toggle
浏览 4提问于2014-04-27得票数 1
回答已采纳
3回答
我试图在角4中创建一个按钮，在调用click事件时调用函数。
<button (click)="toggle()">Toggle Button</button>
然后在.ts文件中，我想要这样的东西：
toggle() {
alert('toggle case 1')
else
alert('toggle case 2');
}
基本上，我想有两个不同的actions...how，我做这个吗？
浏览 5提问于2017-11-01得票数 1
回答已采纳
我们有两个组件共享相同的服务，我们在一个组件中更改服务值，这个值也是我更新其他组件所需要的。
app.component.ts
import { Component } from '@angular/core';
import {ConfigurationService} from './first.servvice';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.com
浏览 2提问于2017-09-26得票数 0
1回答
我知道有很多关于它的主题，但我不知道为什么，它们中没有一个是有效的
我正在使用AdminLTE3，我有选项卡，我想在刷新后停留在选定的选项卡上
我的代码(不工作，但应该可以工作)：
@extends('adminlte::page')
@section('title', 'Mans Profils')
@section('content_header')
@stop
@section('content')
<div class="container">
<
浏览 1提问于2021-04-07得票数 0
3回答
脚本和代码之间的差异？
、、、
请让我问个问题。我只是搞不清javascript、JQuery和代码背后的属性有什么区别。例如: ASPX
<tbody id="toggleSup" runat="server">
C#
toggleSup.Visible = false;
C#
CallScript((string)(Session["toggle"]));
private void CallScript(string str)
{
string scriptx = "<SCRIPT LANGUAGE='java
浏览 1提问于2011-07-12得票数 0
回答已采纳
我在我的页面上使用引导导航选项卡。是否可以将jQuery函数分配给导航选项卡？因此，我需要的是能够分配getDate();，如果有任何的导航标签被点击。
示例：
<ul class="nav nav-tabs">
<li class="active"><a href="#pane1" data-toggle="tab">Home</a></li>
<li><a href="#pane2" data-toggle="
浏览 0提问于2014-10-25得票数 1
回答已采纳
1回答
在这种情况下，我有两个页面在我的本地主机，主页和项目。
主页-本地主机，项目页面-本地主机/项目/
项目页面有来自引导3的nav选项卡：
<ul class="nav nav-tabs" data-tabs="tabs">
<li class="active"><a data-toggle="tab" href="#red">Red</a></li>
<li><a data-toggle="tab"
浏览 2提问于2016-11-07得票数 0
回答已采纳
在不同的选项卡中有两个selectBooleanCheckbox，它们链接到后端bean中的同一个变量，如下所示：
.xhtml:
<p:tabView id="tabsView" widgetVar="tabPanelWidget" dynamic="true" cache="true">
....
<p:tab id="tab1">
<p:outputPanel id="panel1">
<p:
浏览 9提问于2022-09-22得票数 0
回答已采纳
1回答
我有问题的引导工具提示，其中工具提示是工作的(在功能方面(显示在悬停，左位置等)。但他们没有造型！
我有一个ajax，它将数据收集到一个表中，然后使用.html(响应)将该html转储到容器中。
如果功能在DOM加载后加载元素时无法工作，我可以理解，但是为什么没有应用样式呢？
样式表包含在<>php include() ?>中，它可以在所有其他页面上工作，因此正在加载样式表。
我尝试过在许多地方初始化工具提示，以查看样式设计是否得到了正确的应用，例如：
$('body').tooltip({
selector: '[data-toggle=&#
浏览 3提问于2020-02-07得票数 0
回答已采纳
4回答
我的角页上有两个引导带标签，如下所示：
<div>
<ul class="nav nav-tabs">
<li class="active strong">
<a data-target="#home" data-toggle="tab">Tab 1</a>
</li>
<li class="strong">
<a data
浏览 3提问于2013-10-29得票数 4
回答已采纳
1回答
我真的不明白为什么我的组件没有呈现它的更改。
toggle() {
var url = rest.appointments + "/appointments";
Request.get(url).then((response) => {
this.setState(prevState => ({
appointments: response.body.map(a => Object.assign({}, a, { end: new Date(a.end), start: new Date(a.start) })),
浏览 4提问于2018-10-14得票数 0
为什么下面的代码呈现三个thimes，反应呈现的机制是什么？
import React from 'react';
const Toggle = (props) => {
const [ num ,setNumber ] = React.useState(0)
setTimeout(() => {
setNumber(1)
}, 0)
console.log('render'); // render three times ?
return <button >{ console.log(num) }
浏览 2提问于2021-10-10得票数 1
2回答
我有这个Bootstrap导航-药丸-有两个选项卡：
<ul class="nav nav-pills nav-fill kt-portlet__space-x" role="tablist">
<li class="nav-item">
<a class="nav-link active" data-toggle="pill" href="#menu11"><span> TAB1</span></a>
浏览 2提问于2019-08-26得票数 0
我正在尝试为我的网页上的三个表格做一个可选项卡导航。我不能让Javascript在标签上工作。Twitter文档中有两个脚本。
$('#myTab a').click(function (e) {
e.preventDefault();
$(this).tab('show');
})
和
$('#myTab a[href="#profile"]').tab('show'); // Select tab by name
$('#myTab a:first').tab('show'
浏览 1提问于2012-10-02得票数 1
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
