Javascript 更改按钮文本jQuery

我遇到了一个奇怪的问题，无法使用jQuery更改按钮的显示文本。其想法是能够在passwordtext之间切换字段，并使用一个关联的按钮，该按钮的文本在“显示”和“隐藏”之间切换

这是按钮：

<input type="button" id="login-form-showchars" value="Show" onclick="showCharsClicked();"/>

该函数可以工作，但无论我在TODO区域中插入什么代码，按钮上的文本都保持不变。我用“输入”和“按钮”类型尝试了以下所有方法：

document.getElementById('login-form-showchars').value = 'Hide';
$("#login-form-showchars").prop('value', 'Hide');
$("#login-form-showchars").html('Hide');
$("#login-form-showchars").attr('value', 'Hide');
$("#login-form-showchars").val('Hide');
$("#login-form-showchars").text('Hide');

有人知道会出什么问题吗？通过检查按钮，我看到它的值在变化，但这种变化从未在视觉上反映出来

谢谢

==================================== 编辑：我找到了一种让它工作的方法，我想我会把它记录在这里供子孙后代使用。感谢您的所有回答，我现在认为问题是由我的程序使用的特定jQuery接口引起的；这就是为什么它对很多其他人有效，但对我无效

问题是程序在运行时在按钮下方创建了一些嵌套的“span”标记，因此在程序执行期间，它看起来像这样：

<a data-role="button" href="#" id="login-form-showchars" data-theme="v" class="ui-btn ui-btn-corner-all ui-shadow ui-btn-up-v" data-transition="pop" data-direction="reverse">
  <span class="ui-btn-inner ui-btn-corner-all">
     <span class="ui-btn-text">Hide</span>
  </span>
</a>

---

这很有效。希望这有助于人们不必经历我所做的一切

使用

document.getElementById（'login-form-showchars'）。值='Hide'
document.getElementById（'login-form-showchars'）。值='Show'

精确演示显示/隐藏密码+切换按钮文本以显示/隐藏

|

浏览器问题

$('#login-form-showchars').on('click', function() {
  var target = $('#login-form-password'),
      $this = $(this);
  target.attr('type', function(i, oldType) {
     this.type = oldType == 'password' ? 'text' : 'password';
     $this.val(this.type == 'text' ? 'Hide' : 'Show');
  });
});

这就是你想要的吗

$('#login-form-showchars').click(
    function(e){
        var typ = $('#inp').attr('type');
        $('#inp')[0].type = typ === 'password' ? 'text' : 'password';
        this.value = (typ === 'password' ? 'Hide' : 'Show');
    }
)​;

看这个
它适合我（）；也许这是一个浏览器问题？您使用的浏览器是什么？首先，您分配给
密码字段.value
的
变量是什么？然后，无需更改
passwordField
的值来显示/隐藏密码。我使用的是Google Chrome，这是我的代码使用的（唯一）浏览器。虽然我已经看到许多成功的JSFIDLE使用我的代码，但它在实际的程序中不起作用。“也许值得尝试表演而不是标签？”杰西姆我加上小提琴作为证据。请确认我理解你的代码是有效的，但是当移植到我的特定项目时，它就不起作用了。我正在为按钮使用jQuery皮肤；这可能会导致问题吗？很抱歉，我得到了一个未捕获的语法错误：当我运行此代码时，意外的标记非法。JSFIDLE键盘的奇怪输入错误。现在又能用了。
$("#login-form-showchars .ui-btn-text").text("Hide");

$('#login-form-showchars').on('click', function() {
  var target = $('#login-form-password'),
      $this = $(this);
  target.attr('type', function(i, oldType) {
     this.type = oldType == 'password' ? 'text' : 'password';
     $this.val(this.type == 'text' ? 'Hide' : 'Show');
  });
});

$('#login-form-showchars').click(
    function(e){
        var typ = $('#inp').attr('type');
        $('#inp')[0].type = typ === 'password' ? 'text' : 'password';
        this.value = (typ === 'password' ? 'Hide' : 'Show');
    }
)​;