如何修复 jQuery attr ID 更改不起作用？

大佬教程收集整理的这篇文章主要介绍了如何修复 jQuery attr ID 更改不起作用？，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。

如何解决如何修复 jQuery attr ID 更改不起作用？？@H_674_1@ 开发过程中遇到如何修复 jQuery attr ID 更改不起作用？的问题如何解决？下面主要结合日常开发的经验，给出你关于如何修复 jQuery attr ID 更改不起作用？的解决方法建议，希望对你解决如何修复 jQuery attr ID 更改不起作用？有所启发或帮助；

使用 jquery 3.5.1 我尝试在单击另一个按钮时更改按钮上的 ID，使用 $('#convertBtn').attr('ID','convertBtnDownload'); 但这不起作用..有没有人知道为什么以及如何解决这个问题？

工作示例：

$(document).ready(function() {

  $("#convertBtn").click(function() {

    console.log("Clicked")

    $("#convertBtnSpinner").show();
    $("#convertBtn").attr("Disabled",truE);
    $("#convertBtntext").HTML("Genererer <span class='dot dot1'>.</span><span class='dot dot2'>.</span><span class='dot dot3'>.</span>");
    document.documentElement.style.cursor = 'wait'

  });


  $("#convertBtnDone").click(function() {

    console.log("Done")

    $("#convertBtnSpinner").hIDe();
    $("#convertBtn").attr("Disabled",falsE);
    $("#convertBtn").removeClass("btn-priMary");
    $("#convertBtn").addClass("btn-success");
    $("#convertBtntext").HTML("Download pdf <i class='fas fa-download'></i>");
    $('#convertBtn').attr('ID','convertBtnDownload');
    document.documentElement.style.cursor = 'default'

  });


  $('.convertBtnDownload').click(function() {
    $('#resultlink').click();
  });

});

.dot1 {
  animation: visibility 1.5s linear infinite;
}

@keyframes visibility {
  0% {
    opacity: 1;
  }
  65% {
    opacity: 1;
  }
  66% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

.dot2 {
  animation: visibility2 1.5s linear infinite;
}

@keyframes visibility2 {
  0% {
    opacity: 0;
  }
  21% {
    opacity: 0;
  }
  22% {
    opacity: 1;
  }
  65% {
    opacity: 1;
  }
  66% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

.dot3 {
  animation: visibility3 1.5s linear infinite;
}

@keyframes visibility3 {
  0% {
    opacity: 0;
  }
  43% {
    opacity: 0;
  }
  44% {
    opacity: 1;
  }
  65% {
    opacity: 1;
  }
  66% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

<script src="https://AJAX.GoogleAPIs.com/AJAX/libs/jquery/3.5.1/jquery.min.Js"></script>
<link href="https://cdn.Jsdelivr.net/npm/bootstrap@5.0.1/dist/CSS/bootstrap.min.CSS" rel="stylesheet" integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOol7+AMvyTG2x" crossorigin="anonymous">
<script src="https://kit.Fontawesome.com/e3a6e5f796.Js" crossorigin="anonymous"></script>


<button ID="convertBtn" class="btn btn-priMary" style="wIDth: 220px;" type="button">
<span ID="convertBtnSpinner" class="spinner-border spinner-border-sm" role="status" aria-hIDden="true" style="display: none;"></span>
<span ID="convertBtntext">Generate pdf <i class="far fa-file-pdf"></i></span>
</button>
<br>
<br>
<button ID="convertBtnDone" class="btn btn-priMary" type="button">Swap ID</button>

解决方法@H_674_1@

正如@Don'tPanic 建议的那样，我重新考虑了我的解决方案，并提出了一个更好且有效的解决方案：

我没有使用相同的按钮，而是根据它们需要处于的状态隐藏/显示不同的按钮：

<button id="convertBtn" class="btn btn-priMary" style="width: 220px;" type="button">
  <span id="convertBtnSpinner" class="spinner-border spinner-border-sm" role="status" aria-hidden="true" style="display: none;"></span>
  <span id="convertBtntext">Generate PDF <i class="far fa-file-pdf"></i></span>
</button>

<div id="result" style="display: none;">
  <a class="btn btn-success" id="resultLink" href="#" style="width: 220px;" role="button">Download PDF <i class="fas fa-download"></i></a>
</div>

使用的 jQuery :

$( "#convertBtn" ).hide();
$( "#result" ).show();
$( "#resultLink" ).attr("href","<PATH_TO_PDF>.pdf");
document.documentElement.style.cursor = 'hand' 

大佬总结

以上是大佬教程为你收集整理的如何修复 jQuery attr ID 更改不起作用？全部内容，希望文章能够帮你解决如何修复 jQuery attr ID 更改不起作用？所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。