Javascript Jquery相同的按钮有不同的功能

我想要的是ID为

btn

的

在单击时更改颜色。然后，我希望它更改按钮的ID，并使用不同的ID更改相同的

，以便在单击时执行另一个功能

例如：

var btn=$（“#btn”）；
风险值btn2=$（“#btn2”）；
var one=$（“.one”）；
btn.on（“单击”，函数（）{
css（“背景色”、“黑色”）；
btn.attr（“id”、“btn2”）。文本（“Buton2”）；
});
btn2.on（“单击”，函数（）{
css（“背景色”、“绿色”）；
btn2.attr（“id”、“btn”）.文本（“按钮”）；
});
.one{
高度：20px；
宽度：20px；
背景色：红色；
}

按钮
您必须将事件与
$（文档）
绑定，因为它不是静态的

var btn = $("#btn");
var btn2 = $("#btn2");
var one = $(".one");

$(document).on("click","#btn",function(){

  one.css("background-color","black");
  btn.attr("id","btn2").text("Buton2");

});
$(document).on("click","#btn2",function(){

  one.css("background-color","green");
  $(this).attr("id","btn").text("Button");
});

这应该会有所帮助

var btn = $("#btn");

var one = $(".one");

btn.on("click",function(){

one.css("background-color","black");
btn.attr("id","btn2").on( "click", function(){

one.css("background-color","green");
btn2.attr("id","btn").text("Button");
});
});

希望这能有所帮助

愉快学习
您假设更改元素ID将与加载时执行的代码相链接，其中某个元素由该ID搜索。btn2在实例化时为空。以后运行的代码将永远不会回来，并修复这一点，你应该考虑更多的“事件驱动”的方法来JavaScript。假设.on（'click'）在被单击后具有连续性，而不是在编写代码时；）


var btn=$（“#btn”）；
变量btn2=$（“#btn2”）；//这是不存在的
var one=$（“.one”）；
var clickTwo=函数（）{
警报（'CLICK 2！'）；
css（“背景色”、“黑色”）；
btn.attr（“id”，“btn2”）.text（“Buton2”）；//这不会追溯创建#btn2元素，
//更不用说btn2参考了
}
var clickOne=函数（）{
css（“背景色”、“黑色”）；
$（此）.attr（“id”，“btn2”）.text（“Buton2”）；
$（此）。在（'单击'，单击二）
警报（'btn2实际上不存在：jQuery选择的长度为'+btn2.size（））；
}
btn.one（“点击”，点击一次）
.one{
高度：20px；
宽度：20px；
背景色：红色；
}

按钮
此示例介绍了通过使用按位异或运算符交替单个HTMLElement的对象属性值（1,0,1，…）来切换两个函数或值的每种情况


功能aFn（el）{
$（el）.文本（“AAAAA”）；
}
函数bFn（el）{
$（el）.文本（“BBB”）；
}
函数tog（）{
var io=this.io^=1；//1/0切换程序；El Obj属性
//使用带有三元运算符的'io'的示例
$（.one”）.css（“背景色”，io？“黑色”：“绿色”）；
//使用'io'切换两个函数的示例
[aFn，bFn][io]（本）；
//如果需要切换ID：
this.id=io？“btn2”：“btn”
}
//难以置信，即使我们更改了ID，您所需要的只是：
美元（“#btn”）。在（'click'，tog'）
.one{
高度：20px；
宽度：20px；
背景色：红色；
}
#btn{}
#btn2{填充：10px；边框：4px纯金；}

按钮
我想你最好的选择是实际上有两个不同的按钮，然后在它们之间切换显示：无。好的，等一下。。。您实际需要的是一个按钮来切换两个功能？一个按钮可以充当两个不同的按钮，切换id。它在第一次运行clickOne时一直在调用click2。反过来，clickOne将ClickHandler设置为clickTwo，并将其粘贴在按钮上。它不会自行拆卸/更换。Click将由clickTwo处理，除非clickTwo没有删除自身，或者其他人调用btn.off（'Click'/*，clickTwo*/）；