提交后更改表单提交按钮文本
Change form submit button text after submition
提交后如何更改提交按钮文本??我有一个带有按钮的表单。我想在提交表单后将按钮文本从click更改为Next。
<form>
<div class="form-group">
<div class="rightbox"> <label for='phone'>phone</label></div>
<div class="leftbox">
<div class="col-sm-12">
<input class="text-box single-line" data-val="true" name="phone" type="tel" value="" />
</div></div>
</div>
<div class="form-group">
<div class="rightbox"> <label for='phone'>mobile</label></div>
<div class="leftbox">
<div class="col-sm-12">
<input class="text-box single-line" data-val="true" name="phone" type="tel" value="" required />
</div></div>
</div>
<div class="form-group">
<div class="col-sm-offset-3 col-sm-9">
<div class="btnok">
<br/>
<button type="submit" class="btn-primary" >
click
</button>
</div>
</div>
</div>
</form>
$("#save").on('click',function(){
var $btnElm = $(this);
$("form").submit(function() {
return $btnElm.text('Next');
});
})
<button type="submit" class="btn-primary" id="save" >
我认为这是你可以改变的方式。
如果你想更具体地使用only after表单那么你可以使用ajax方法提交表单并将文本of按钮更改为next after submit表单
$("#save").on('click',function(){
var $btnElm = $(this);
$("form").submit(function() {
$.ajax({
url: $(this).attr('action'),
method: "POST",
data : $(this).serialize(),
success : function (data){
$btnElm.text('Next');
}
});
});
});
你可以试试下面的链接。
小提琴联系
$(document).ready(function(e) {
$('#theForm').submit(function() {
var txt = $('#btnSubmit');
txt.val("Next");
return confirm("Do you want to save the information?");
});
});
更新链接:Fiddle
试试这个。
首先,将id
添加到表单和按钮中。
<form id="myform">
....
<button id="mybutton" type="submit" class="btn-primary" >
click
</button>
...
</form>
然后,使用JQuery,你可以在表单提交后做一个JQuery回调。
$("#myform").bind('ajax:complete', function() {
document.getElementById("mybutton").value="New Button Text";
});
这对我有用。我希望这对你有帮助。
编辑
如果你不想使用JQuery,你可以使用onSubmit
事件在表单提交后调用一个函数。
<form onsubmit="changeButton()">
....
<button id="mybutton" type="submit" class="btn-primary" >
click
</button>
...
</form>
这是修改按钮文本的功能。
function changeButton(){
document.getElementById("mybutton").value="New Button Text";
}
相关文章:
- 我想重定向点击,然后更改按钮文本,我该怎么做
- 使用JavaScript将标题文本替换为按钮文本
- 将按钮文本从“;喜欢“;至“;喜欢“;单击时
- 如何在jQuery mobile中更改按钮文本
- 不便更改Javascript中的按钮文本
- 为什么我的导航按钮或按钮文本不会移动到中心
- 根据单选按钮值更改提交按钮文本
- 更改按钮文本
- 按钮文本中的新行
- 在呈现 D3 SVG 对象之前更改引导按钮文本
- 制作一个“;输入“;按钮文本不可编辑
- 通过引导程序加载/重置后更改按钮文本
- 动态创建的按钮文本
- jQuery移动列表过滤:如何更改清除按钮文本
- 如何使用JavaScript在点击时更改按钮文本
- sap.m.按钮文本格式化程序
- AngularJS按钮文本不起作用
- 如何在单击时更改按钮文本
- 使用Jquery仅切换按钮文本中的ASCII字符
- TinyMCE 编辑输入值和按钮文本