jQuery 可以更改输入提交类型的文本，但按钮不再可点击

Question

我使用的是 jaquery 和 jquery 移动版 1.8，我有一个这样的按钮：

   <div class="ui-bar-a" id="myButton" style="bottom:0;position: fixed;width: 100%">
        <input type="submit" name="Next" id="NextButton" value="Save"  /> 
   </div>

我有一个 javascript 可以像这样更改文本：

     $('#AnyButton').live('click', function() {             
        if(true)
        {
            $('#myButton div').text('Saving')
        }
        else
            $('#myButton div').text('Continue');
    });

我尝试了很多其他方法都没有用，但这个方法有效，但是在我更改文本后，按钮似乎用文本 Saving 或 Continue 替换了 myButton div 内容，因此按钮没有更长的可点击时间。

在我的浏览器调试器中，按钮显示文本保存出现在 myButton 和 Nextbutton 输入之间。

像这样：

<div class="ui-bar-a" id="myButton" style="bottom:0;position: fixed;width: 100%">
"Save"
      <input type="submit" name="Next" id="NextButton" value="Save"  /> 
</div>

Answer 1

如果我没看错你的post，你想更改输入，您需要更改它的值属性。我认为 .live 相对较旧且已弃用，应替换为 .on 和委托事件处理程序

$('#AnyButton').live('click', function() {             
    if(true)
        $('#myButton').find('input[type="submit"]').val('Saving');
    else
        $('#myButton').find('input[type="submit"]').val('Continue');
});

Answer 2

我怀疑您的代码中包含的内容比您提供的要多。对于 jQuery 移动版，每个 input 都被视为一个按钮。所以你可能需要在动态更新后刷新它。

此代码有效：

$(function() {
  $("#NextButton").click(function(e) {
    e.preventDefault();
    $(this).val("Saving").button("refresh");
  });
});

<link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
<script src="https://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
<div class="ui-bar-a" id="myButton" style="bottom:0;position: fixed;width: 100%">
  <input type="submit" name="Next" id="NextButton" value="Save" />
</div>

查看更多：https://api.jquerymobile.com/button/ and https://demos.jquerymobile.com/1.4.5/button/

jQuery 可以更改输入提交类型的文本，但按钮不再可点击

jQuery can change the text of input submit type but button is no longer clickable

javascript

jquery

jquery-ui

jquery-plugins

jquery-mobile