如何<button>使用javascript或jquery</button>将<button>元素中</button>的值替换为其他值<button>？</button>

Question

这是我正在使用的按钮。 目标是将值名称从“应用促销”更改为“应用促销代码”。

<input id="btn_promo" ng-disabled="EditingDisabled" type="button" class="btn btn-default" value="Apply Promo" ng-click="applyPromotion()" aria-disabled="false">

我尝试了两种方法来实现此目的，但没有一种有效。 脚本应该放在文档中的什么位置？ 页眉？ 页脚？ 我认为这可能是位置，但不确定。

尝试的方法：

document.getElementById('btn_promo').value = 'Apply Promo Code';

和

function  replaceBTN() {
  var newValue = document.getElementById("btn_promo").innerHTML;
  var res = newValue.replace("Apply Promo","Apply Promo Code");
  document.getElementById("btn_promo").innerHTML = res;
}

第一种方法可以在空白文档中自行工作，但是一旦我尝试将其应用于实际文档，它便无法正常工作。

-运行正常-编辑：

$(document).ready(function() {
  $('input#btn_promo').attr('value','Apply Promo Code');
});

Answer 1

您应该使用value而不是innerHTML ：

 function replaceBTN() { var newValue = document.getElementById("btn_promo").value; var res = newValue.replace("Apply Promo", "Apply Promo Code"); document.getElementById("btn_promo").value = res; } replaceBTN(); 

 <input id="btn_promo" ng-disabled="EditingDisabled" type="button" class="btn btn-default" value="Apply Promo" ng-click="applyPromotion()" aria-disabled="false"> 

Answer 2

您是否要在页面加载后立即更改attr的值？ 或点击事件？ 为什么不只是更改HTML？

尝试在关闭身体标签之前或想要进行更改的任何时候立即调用此脚本。

$('#btn_promo').attr('value', 'Apply Promo Code');

Answer 3

最佳解决方案，因为在应用jquery之前首先需要加载DOM。 如果未首先加载，下面的jquery代码将无法检测到输入的值。 这将使其能够执行此操作，然后应用必要的内容。 由于某种原因，这个预生成的网上商店在加载完所有内容之前不会应用任何jquery代码。

/*Will check if the whole page is loaded*/
$(document).ready(function() {
    /*The value="Apply Promo" will be changed after everything is loaded*/
    $('input#btn_promo').attr('value','Apply Promo Code');
});