无法通过ajax更改按钮值

应用http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css和http://code.jquery.com/mobile/1.3.2/jquery.mobile后-1.3.2.min.js

脚本$(this).val('new value');不能改变按钮的文本$(this).val('new value');

有没有人有类似的经验并有解决方案?

DEMO可以从FIDDLE尝试

JQUERY:

 $(document).ready(function () { $('#submit_btn').click(function (e) { e.preventDefault(); $(this).val('Processing ...'); $.ajax({ cache: false, type: "POST", dataType: "json", data: $('#form1').serialize(), url: "echo/json", complete: function (HttpRequest, textStatus) { $(this).val('Create'); } }); return false; }); }); 

HTML:

 

你能试试吗

  $(".ui-btn-text").text('Processing ...'); 

码:

 $(document).ready(function () { $('#submit_btn').click(function (e) { e.preventDefault(); $(".ui-btn-text").text('Processing ...'); $.ajax({ cache: false, type: "POST", dataType: "json", data: $('#form1').serialize(), url: "echo/json", complete: function (HttpRequest, textStatus) { $(".ui-btn-text").text('Create'); } }); return false; }); }); 

演示: http : //jsfiddle.net/Rz2sJ/4/

当AJAX回调运行时, this作为关键字失去了它的上下文。 您需要将其分配给变量以保留引用。 像这样的东西:

 $(document).ready(function () { $('#submit_btn').click(function (e) { e.preventDefault(); var button = $(this); button.val('Processing ...'); $.ajax({ cache: false, type: "POST", dataType: "json", data: $('#form1').serialize(), url: "echo/json", complete: function (HttpRequest, textStatus) { button.val('Create'); } }); return false; }); }); 

您正在使用jQuery Mobile的.button()小部件。 被转换为div,使jQuery Mobile焕然一新。

进行任何更改时,您需要刷新该元素以重新应用样式。

您需要做的就是:

 $(".selector").val('Processing ...').button("refresh"); 

演示

最后应用$('#button').prev().text('your new text'); 工作。

只是不明白为什么在更改文本之前使用.prev()