javascript - JQuery - 更改元素 id 不起作用

标签 javascript jquery

我正在尝试通过动态更改按钮的 ID 来更改按钮的功能。

<srcipt>
$("#old-id").click(function func_P(){
  //Some code
  this.id = "new-id";
});
$("#new-id").click(function func_Q(){
  // some other code
});
$("#clear").click(function func_R(){
  $(".in").attr("id","new-id");
});
</script>

<body>
  <button id="old-id" class="in">Button A</button>
  <button id="clear">Clear</button>
</body>

但我面临的问题是,当我单击“按钮 A”时,id 会更改,但是当我再次单击“按钮 A”时,func_P() 会再次执行,而不是我打算调用 func_Q。

最佳答案

使用.on 函数绑定(bind)(实时) 点击。

$("#old-id").on('click', function func_P(e) {
  //Some code
  if (this.id == "old-id") {
    this.id = "new-id";
    console.log('old id clicked');
    e.stopPropagation()
  }
});
$(document).on('click', "#new-id", function func_Q() {
  // some other code
  console.log('new id clicked');
});
$("#clear").on('click', function func_R() {
  $(".in").attr("id", "old-id");
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="old-id" class="in">Button A</button>
<button id="clear">Clear</button>

如果您想清除id,您应该更改:

$(".in").attr("id","new-id");

致:

$(".in").attr("id", "old-id");

关于javascript - JQuery - 更改元素 id 不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47951369/

相关文章:

javascript - 提交时隐藏表单 - Django 1.6

javascript - AngularJS:对小时和分钟数组进行排序

javascript - 如何通过单击文本打开网页

javascript - 在窗口关闭时发送通知

javascript - 如何在jquery中获取同一类的文本值

javascript - jQuery:包含 <option>VALUE</option> 的选择器

javascript - 单击以使用 jquery 获取数组元素的索引

javascript - Dailymotion 视频自动播放和静音

jquery - MVC3 jquery.validate.unobtrusive 覆盖选项而不编辑源代码?

javascript - 根据屏幕尺寸调整 Div 大小并保持宽高比