Javascript CSS切换按钮？

是否可以在PhoneGAP中使用CSS切换按钮？ 我想要一个按钮，改变颜色，如果点击，当再次点击它必须回到默认颜色。你知道怎么做吗

我已经编辑了我的帖子，你们可以很容易地帮助我，因为现在我真的很困惑如何做到这一点，简单的东西，但技巧

  `This the function 

  function toggle(ths) {

   //CSS color
   $(ths).toggleClass("btnColor");
   $("#tb").toggleClass("btnColorR")

   //Get value clicked
   var clicked = $(ths).val();

   //diplay on web-page
   $("#lblType").html(clicked);
   $("#setCount").html(" minutes : " + minutes + " seconds : " + seconds);

   //duration time count
   seconds = seconds + 1;
   if (seconds % 60 == 0) {
      minutes += 1;
   seconds = 0;
 }
        timer = setTimeout("toggle()", 1000);   
  }


 The CSS

.btnColor
 {
 background-color:blue;  
 color:white;  
 }
.btnColorR {
 background-color:green;
}


  This is how my buttons are created.

 function createButtons(tbID, tbClass, tbType, tbValue, onClick) {
     return '\n<input '
        + (tbID ? ' id=\'' + tbID + '\'' : '')
        + (tbClass ? ' class=\'' + tbClass + '\'' : '')
        + (tbType ? ' type=\'' + tbType + '\'' : '')
        + (tbValue ? ' value=\'' + tbValue + '\'' : '')
        + (onClick ? ' onclick=\'toggle(this);' + onClick + '\'' : '')
        + '>';
 }

 function DisplayButtons(cableData) {
  var newContent = '';
   $.each(cableData,

    function (i, item) {
       newContent += createButtons("tb" + item.CommonCable, null, "submit",       item.CommonCable, toggle);
   });
   $("#planned").html(newContent);
 }`

`这是一个函数
功能切换（ths）{
//CSS颜色
$（ths）.toggleClass（“btnColor”）；
$（“#tb”）.toggleClass（“btnColorR”）
//点击获取值
var clicked=$（ths.val（）；
//在网页上显示
$（“#lblType”）.html（单击）；
$（“#setCount”）.html（“分钟：+minutes+”秒：+seconds）；
//持续时间计数
秒=秒+1；
如果（秒%60==0）{
分钟+=1；
秒=0；
}
定时器=设置超时（“toggle（）”，1000）；
}
CSS
.btnColor
{
背景颜色：蓝色；
颜色：白色；
}
.Btncolor{
背景颜色：绿色；
}
这就是我的按钮是如何创建的。
函数createButtons（tbID、tbClass、tbType、tbValue、onClick）{
返回“\n”；
}
功能显示按钮（cableData）{
var newContent=''；
$。每个（电缆数据，
职能（一、项目）{
newContent+=createButtons（“tb”+item.CommonCable，空，“提交”，item.CommonCable，切换）；
});
$（“#计划”）.html（新内容）；
}`

认为您的按钮是

#butt

：

$("#butt").click(function(){
     $(this).toggle('red');
})

和CSS：

.red{
 color:red;
}

---

Phonegap是一个库，可帮助您的移动web应用程序具有本机应用程序的所有功能。因此，在设计应用程序时，可以使用html或任何js框架，如Sencha、Jquery、YUI、JQM等。并使用phonegap制作应用程序包

使用Phonegap类，您将能够访问所有本机功能，如照相机、通讯录、附件等。 因此，您的CSS切换按钮将在任何情况下工作。Phonegap没有任何作用。

功能切换（ths）
function toggle(ths)
{
    if ($(ths).attr('class') == "btnColor") {
        $(ths).removeClass("btnColor");
        $(ths).addClass("btnColorR");
    } else {
        $(ths).removeClass("btnColorR");
        $(ths).addClass("btnColor");
    }
}

function createButtons(tbID, tbClass, tbType, tbValue, onClick)
{
    return '\n<input '
    + (tbID ? ' id=\'' + tbID + '\'' : '')
    + (tbClass ? ' class=\'' + tbClass + '\'' : '')
    + (tbType ? ' type=\'' + tbType + '\'' : '')
    + (tbValue ? ' value=\'' + tbValue + '\'' : '')
    + (onClick ? ' onclick=\''+onClick(this)+';\'' : '')
    + '>';
}

{
if（$（ths）.attr（'class'）==“btnColor”）{
$（ths）.removeClass（“btnColor”）；
美元（ths）.addClass（“BTNCorr”）；
}否则{
$（ths）.removeClass（“BTNCorr”）；
$（ths）.addClass（“btnColor”）；
}
}
函数createButtons（tbID、tbClass、tbType、tbValue、onClick）
{
返回“\n”；
}

我认为你不需要JS，因为CSS只能根据你的浏览器矩阵来完成。基本上，您可以使用复选框，隐藏它，并根据需要设置所属标签的样式。然后，您可以通过clivk上的

：checked

和

：not（：checked）

选择器切换样式（请确保检查浏览器支持）。演示：

---

我写了一篇教程，介绍如何仅使用CSS自定义复选框和收音机，以及如何创建开/关切换开关。也许这有帮助：）您可以根据需要更改样式。阅读这里的教程：

非常感谢，但它仍然不起作用，我的css在我搬到Phonegap之前就已经起作用了。我不知道这是怎么回事，甚至还以为我现在疯了。再次感谢您查看if

$（“#butt”）。单击（函数（）{alert（1）}）

正在工作。它不工作，我可以编辑我的帖子并包含代码我的按钮是如何用cssit创建的吗？当我不使用PhoneGap时，它工作正常，但一旦我尝试PhoneGap它就不工作了。我想我需要一些时间来阅读电话簿