用按钮切换多个ID

-1

我是新的JavaScript初学者，我真的很想学习它，我最近尝试用Codemiror制作HTML编辑器，并提供所有可能的选项和设置。我知道这对新手来说很难，但我有信心。所以现在我试图为HTML编辑器制作可变化的分割面板。我有Splitpane“jquery splitpane”，我想要在水平和垂直视图之间切换。但要做到这一点，我需要更改用于分割面板的div的“类”和“IDS”。垂直分割面板有一些类和IDS，水平分割有其他类。我发现如何使用按钮同时切换多个类，但是现在我遇到了“IDS”问题。我在网站上找到了一个修改脚本的脚本，但是我无法使它工作。如果你们能帮我解决这个问题，我真的很感激它。因此，这里是用于切换ID的脚本：用按钮切换多个ID

#red {background:red;} 
 
#blue {background:blue;} 
 

 
#green {background:green;} 
 
#yellow {background:yellow;}

<button href="#" class="buttontoggle buttontoggle2">changehtmlstyle</button> 
 

 
<div id="blue" class="toggleelement">This is a div</div> 
 

 
<div id="green" class="toggleelement2">This is a div</div> 
 

 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<script type="text/javascript"> 
 
    var clickCount = 0; 
 
    $(".buttontoggle").on("click", function() { 
 
     clickCount++; 
 
     $("div.toggleelement").attr("id", clickCount % 2 === 0 ? "blue" : "red"); 
 
    }); 
 
</script> 
 

 
<script type="text/javascript"> 
 
    var clickCount = 0; 
 
    $(".buttontoggle").on("click", function() { 
 
     clickCount++; 
 
     $("div.toggleelement2").attr("id", clickCount % 2 === 0 ? "blue" : "red"); 
 
    }); 
 
</script>

我可以切换ID之一，如果我删除其中的一个，但我需要4点以上的ID在同一时间切换。

来源

2017-09-01 STEN

[div id和div class之间的差异可能重复]（https://stackoverflow.com/questions/544010/difference-between-div-id-and-div-class） –

作为参考，您可以选择multiple使用jQuery（如'$（“＃red #blue”）''）的ID。 –

@StevenGoodman不应该是'$（“＃red，＃blue”）'？ – jmoerdyk

您已为.buttontoggle创建了两个点击事件功能。点击按钮将导致这两个函数运行。由于每个功能都有clickCount++，因此每次点击后clickCount的值会增加2。一遍又一遍地加0，总是给你2的倍数，而2的mod会总是给你0.这就是为什么你永远不会看到颜色切换，因为只有一个条件总是成立的。

我不确定你为什么写了两次事件，但有几个解决方案。您可以使用符合您需要的任何一种。如果你只有一个点击事件罚款，那么就合并两个事件：

var clickCount = 0; 
$(".buttontoggle").on("click", function() { 
    clickCount++; 
    $("div.toggleelement").attr("id", clickCount % 2 === 0 ? "blue" : "red"); 
    $("div.toggleelement2").attr("id", clickCount % 2 === 0 ? "blue" : "red"); 
});

或者，如果你需要两个函数以任何理由，你可以从他们的一个删除clickCount++。

来源

2017-09-02 06:00:54

用按钮切换多个ID

回答

相关问题