按钮文本不会改变 jQuery答案

【问题标题】：Button Text Does Not Change jQuery按钮文本不会改变 jQuery
【发布时间】：2015-12-16 06:59:05
【问题描述】：

好的，我已经搞砸了几个小时，决定问一下。我搜索了 StackOverflow 和谷歌，没有任何解决方案。我正在尝试更改按钮的文本，如下所示。

<input id="btnRegUpdate" type="submit"  onclick="updatePrice(1)" value="Correct">

updatePrice() 函数被调用并检查一些事情，最后我有一个 if 语句检查值是否正确，如果正确，它将更改文本，或者假设。

var btnRegUpdate = $('#btnRegUpdate');

if (btnRegUpdate.attr('value') == 'Correct'){
    logMessage("Button was correct");
    btnRegUpdate.text("Update");
}

此时我已经尝试了此解决方案jQuery change button text 中的所有内容，但没有任何效果。我收到了 logMessage，但按钮仍然没有改变。

更新：似乎没有任何效果。我在一个新函数中再次尝试了一切，以防其他逻辑搞砸了。快速测试后看看文字是否有变化

function updatePrice2(val, e) {
    e.preventDefault();
    var btnRegUpdate = $('#btnRegUpdate');

    if (btnRegUpdate.attr('value') == 'Correct') {
        logMessage("Button was correct");
        btnRegUpdate.val("Update");
    }else if(btnRegUpdate.attr('value') == 'Update'){
        logMessage('Button was update');
        btnRegUpdate.val("Correct");
    }
}

控制台显示它已更改但未显示在屏幕上。

【问题讨论】：

标签： javascript jquery

【解决方案1】：

更改 innerHTML 而不是文本。像这样：

btnRegUpdate.html("Update");

编辑：

刚刚注意到您使用的是 <input> 而不是 <button>，请更改 value 属性：

btnRegUpdate.attr('value', 'Update');

【讨论】：

您的回答最终解决了问题。我将<input> 更改为<button>，然后使用.html 更改文本。

【解决方案2】：

你需要

btnRegUpdate.attr("value", "Update")

而不是

btnRegUpdate.text("Update");

【讨论】：

【解决方案3】：

var btnRegUpdate = $('#btnRegUpdate');
if (btnRegUpdate.val() == 'Correct'){
    btnRegUpdate.attr('Value',"Update");
}

尝试使用btnRegUpdate.attr('Value',"Update");

Demo

【讨论】：

【解决方案4】：

试试这个：

防止提交按钮的默认操作

使用val()更改按钮的值

function updatePrice(val, e) {
  e.preventDefault();
  var btnRegUpdate = $('#btnRegUpdate');

  if (btnRegUpdate.attr('value') == 'Correct') {
    console.log("Button was correct");
    btnRegUpdate.val("Update");
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="btnRegUpdate" type="submit" onclick="updatePrice(1,event)" value="Correct">

【讨论】：

【解决方案5】：

输入元素的文本是由它的值属性定义的，而不是内容。要更改文本，请更新 value 属性：

btnRegUpdate.attr('value', "Update");

而不是

btnRegUpdate.text("Update");

【讨论】：

【解决方案6】：

使用 jQuery，您可以使用 .html() 来更改内容。它的工作原理与 javascript 的 .innerHtml 相同

var btnRegUpdate = $('#btnRegUpdate');

if (btnRegUpdate.attr('value') == 'Correct'){
    logMessage("Button was correct");
    btnRegUpdate.html('Update')
}

【讨论】：

【解决方案7】：

将return false 添加到点击处理程序。

<input id="btnRegUpdate" type="submit"  onclick="updatePrice(1); return false;" value="Correct">

否则页面将尝试提交并重新加载。

【讨论】：

【解决方案8】：

你的功能看起来不错，但我不知道它不起作用。

function updatePrice2(val, e) {
    e.preventDefault();
    var btnRegUpdate = $('#btnRegUpdate');

    if (btnRegUpdate.attr('value') == 'Correct') {
        logMessage("Button was correct");
        btnRegUpdate.val("Update");
    }else if(btnRegUpdate.attr('value') == 'Update'){
        logMessage('Button was update');
        btnRegUpdate.val("Correct");
    }
}

我建议你检查一下你的页面并找到 id "btnRegUpdate"，它可能不止一个。

【讨论】：