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)
上一篇 2022年5月20日 上午8:00
下一篇 2022年5月20日 上午8:00


相关推荐

  • dw网页制作入学教程_网站制作之dreamweaver入门

    dw网页制作入学教程_网站制作之dreamweaver入门1dreamweaver入门(2004版本):功能简介:MacromediaDreamweaverMX2004(简称DWMX2004),是Macromedia最新开发的的HTML编辑器,用于对Web站点、Web页和Web应用程序进行设计、编码和开发。DWMX2004包含有一个崭新、简洁、高效的界面,且性能也得到了改进。此外,还包含了众多新增的功能,改善了软件的易用性并使您无…

    2022年5月15日
    40
  • EasyAdmin 注解权限

    EasyAdmin 注解权限控制器注解权限控制器类注解 tag ControllerAn 注解类 EasyAdmin annotation ControllerAn 作用范围 CLASS 参数说明 title 控制器的名称 必填 auth 是否开启权限控制 默认为 true 选填 Enum true false 示例备注 注解前请先引用 useEasyAdmin annotation ControllerAn phpnam

    2026年3月19日
    2
  • LINUX软件的安装

    LINUX软件的安装

    2021年8月2日
    60
  • eclipse自动提示+自动补全[通俗易懂]

    eclipse自动提示+自动补全[通俗易懂]解决代码的自动提示问题:1、打开Eclipse->Window->Perferences2、找到Java下的 Editor下的 ContentAssist, 右边出现的选项中,有一个AutoactivationtriggersforJava:会看到只有一个”.”存在。表示:只有输入”.”之后才会有代码提示3、先把上图中”.”的地方输入几个随便的字

    2022年6月28日
    34
  • Python 正则匹配数字

    Python 正则匹配数字电话号码:\d{3}-\d{8}|\d{4}-\d{7}QQ号:[1-9][0-9]{4,}中国邮政编码:[1-9]\d{5}(?!\d)身份证:\d{15}|\d{18}ip地址:\d+\.\d+\.\d+\.\d+[1-9]\d*   正整数-[1-9]\d* 负整数-?[1-9]\d* 整数[1-9]\d*|0 非负整数-[1-9]

    2022年6月29日
    24
  • 数组 python_python没有数组

    数组 python_python没有数组python数组PythonArraycontainsasequenceofdata.Inpythonprogramming,thereisnoexclusivearrayobjectbecausewecanperformallthearrayoperationsusinglist.Todaywewilllearnaboutpython…

    2022年8月13日
    8

发表回复

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

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