easyui textbox 绑定oninput事件

easyui textbox 绑定oninput事件需求:想要在一个input框输入的同时,另一个输入框的值实时变化!但是easyui只提供了onchange事件,只有当第一个输入框的光标移开时才会触发事件,不能达到实时变化的效果。于是开始各种百度,寻求easyuitextbox绑定事件的方法,但是无奈各种尝试都以失败告终!但是机智的我突然灵光一闪,心生一计,瞬间药到病除,问题迎刃而解!闲言少叙,方案走你!方案:通过easyui

大家好,又见面了,我是你们的朋友全栈君。

需求:想要在一个input框输入的同时,另一个输入框的值实时变化!

但是easyui只提供了onchange事件,只有当第一个输入框的光标移开时才会触发事件,不能达到实时变化的效果。

于是开始各种百度,寻求easyui textbox 绑定事件的方法,但是无奈各种尝试都以失败告终!

但是机智的我突然灵光一闪,心生一计,瞬间药到病除,问题迎刃而解!闲言少叙,方案走你!

方案:通过easyui的自定义校验来实现(easyui的校验是实时的)

//validatebox 自定义校验

$.extend($.fn.validatebox.defaults.rules, {    
    //校验正整数,并计算码洋
    calculateMY:{

    validator : function(value) {

    var reg = /^\d+$/;
    if(reg.test(value)){

    calculateMY(value);
    return true;
    }
    return false;
    },
    message : ‘请输入正整数’
    }
});  

//html元素

<tr>
<td style=”padding-left:10px”>商品总数:</td>
<td align=”left”>
<input class=”easyui-textbox” type=”text” id=”number_edit”
data-options=”validType:’calculateMY’,required:true” />
</td>
</tr>
<tr>
<td style=”padding-left:10px”>码洋:</td>
<td align=”left”>
<input class=”easyui-textbox” type=”text” disabled=”disabled” id=”totalPrice_edit”/>
</td>
</tr>

//回调函数

function calculateMY(value){

var price =$(“#unitPrice_edit”).textbox(‘getValue’);
if(value==null||value==0){

$(“#totalPrice_edit”).textbox(‘setValue’,price*value);
}else{

$(“#totalPrice_edit”).textbox(‘setValue’,price*value);
}
}

此举虽为偷梁换柱,异曲同工,实现了想要的效果,但还是比较繁琐,如果大家有更好的方法,欢迎提出,大家共同进步!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/144131.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • latex多行公式一个编号_word输入latex公式

    latex多行公式一个编号_word输入latex公式注:本人不提供任何版本的Mathtype软件安装包。前面分享了6.x版本Mathtype在高版本Word中安装插件的方法:如何在MSWord中添加Mathtype插件?但是我发现大多数人使用Mathtype编辑公式的效率极低,主要体现在不管啥命令都用鼠标在Mathtype的UI界面中选择,这样势必会花费很多时间,因为手一会儿在键盘上,一会儿在鼠标上,很容易分心。…

    2022年10月11日
    3
  • 《科研诚信与学术规范》参考答案最新版

    《科研诚信与学术规范》参考答案最新版研究人员在通过大众传媒传播自己已经发表的研究成果时,以下哪一个表述不正确:1.11【单选题】为了确保学术和科研(),多大学制定了荣誉法则。A、效率B、质量C、风格D、诚信正确答案:D我的答案:D2【判断题】大学建立荣誉制度的初衷旨在预防大学生考试作弊。正确答案:√我的答案:√3【判断题】科学研究与学术工作与人类其他活动一样,均建立在诚信之上。正确答案:√我的答案:√4【判断题】很多大学制定了荣誉法则的目的是为了确保学术和科研诚信。…

    2022年5月22日
    63
  • 最长公共子串 动态规划_最长公共子串 DNA序列

    最长公共子串 动态规划_最长公共子串 DNA序列原题链接题目描述给定两个字符串str1和str2,输出连个字符串的最长公共子序列。如过最长公共子序列为空,则输出-1。输入描述:输出包括两行,第一行代表字符串str1,第二行代表str2。( 1<= length(str1),length(str2)<= 5000)输出描述:输出一行,代表他们最长公共子序列。如果公共子序列的长度为空,则输出-1。示例1输入1A2C3D4B56B1D23CA45B6A输出123456说明”123456″和“12C4B6”都是最长公共

    2022年8月8日
    10
  • 降维

    降维

    2021年5月20日
    141
  • Git输出格式——Git placeholders

    Git输出格式——Git placeholders

    2021年9月1日
    57
  • Node.JS 删除数组元素

    Node.JS 删除数组元素//数组数据varvalArray=[2,2,2,3,4,5,2,6,7];//删除的值vardelVal=2;//删除元素for(vari=0;i<valArray.length;i++){//数据比对if(valArray[i]==delVal){//删除值valArray.splice(i,1);//下标递减i–;}}//输出日志console.log(.

    2025年6月15日
    7

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号