[英]Change form submit button text after submition
提交后如何更改提交按钮的文字? 我有一个带按钮的表格。 提交表单后,我想将按钮文本从单击更改为下一步。
<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" >
我认为这是您可以改变的方式。
否则,您想在提交表单后进行更详细的说明,然后可以使用ajax方法提交表单,并在仅提交表单后将button的文本更改为next
$("#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'); } }); }); });
试试这个。
首先,向您的表单和按钮添加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";
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.