本文介绍使用jQuery在单击按钮后更改按钮文字的方法。你可能需要此信息通知用户已单击该按钮。例如,当单击“提交”按钮时,您可以将按钮文字更改为“提交”,即“提交”。当处理请求时,文字可能会再次更改,它会说“已提交”。
jQuery实例:单击按钮后更改按钮文字
HTML代码
示例HTML是一个按钮(button)代码,默认文字是“提交”。
jQuery代码
jQuery代码实现当点击按钮后,按钮文字变成“正在提交...”,稍等片刻,按钮文字变成“已提交!”,同时按钮变成灰色不可再点击,jQuery如何让按钮、div等标签disabled(禁用/不可点击)。
$(document).ready(function(){
$("#btnSubmit").click(function(){
$(this).val("正在提交...");
setTimeout(function(){
$("#btnSubmit").val("已提交!");
//按钮变成不可点击
$("#btnSubmit").attr("disabled", "disabled");
},2000);
});
});
jQuery实现代码其实很简单,只用了jQuery的val()方法。
知识延伸:jQuery 属性操作 - val() 方法
定义和用法
val() 方法返回或设置被选元素的值。
元素的值是通过 value 属性设置的。该方法大多用于 input 元素。
如果该方法未设置参数,则返回被选元素的当前值。
语法
$(selector).val(value)参数 描述
value 可选。规定被选元素的新内容。
返回 Value 属性
返回第一个匹配元素的 value 属性的值。
语法
$(selector).val()
设置 Value 属性的值
$(selector).val(value)参数 描述
value 设置 Value 属性的值。
使用函数设置 Value 属性的值
$(selector).val(function(index,oldvalue))参数 描述
function(index,oldvalue) 规定返回要设置的值的函数。
index - 可选。接受选择器的 index 位置。
oldvalue - 可选。接受选择器的当前 Value 属性。
你可能对以下文章也感兴趣