這篇文章主要介紹“jQuery怎么實(shí)現(xiàn)金額錄入框”的相關(guān)知識(shí),小編通過(guò)實(shí)際案例向大家展示操作過(guò)程,操作方法簡(jiǎn)單快捷,實(shí)用性強(qiáng),希望這篇“jQuery怎么實(shí)現(xiàn)金額錄入框”文章能幫助大家解決問(wèn)題。

我們提供的服務(wù)有:成都網(wǎng)站制作、網(wǎng)站設(shè)計(jì)、微信公眾號(hào)開發(fā)、網(wǎng)站優(yōu)化、網(wǎng)站認(rèn)證、彰武ssl等。為上1000家企事業(yè)單位解決了網(wǎng)站和推廣的問(wèn)題。提供周到的售前咨詢和貼心的售后服務(wù),是有科學(xué)管理、有技術(shù)的彰武網(wǎng)站制作公司
首先通過(guò)(function($){ })(jQuery); 即時(shí)執(zhí)行函數(shù)用于模塊隔離,可以避免與其他功能模塊、插件之間產(chǎn)生變量污染問(wèn)題,所有私有的全局變量可以放在即時(shí)執(zhí)行函數(shù)的頭部。
然后在jquery原型上擴(kuò)展numbox方法
(function ($) {
// 數(shù)值輸入框
$.fn.numbox = function (options) {
var type = (typeof options);
if (type == 'object') {
// 創(chuàng)建numbox對(duì)象
if (options.width) this.width(options.width);
if (options.height) this.height(options.height);
this.bind("input propertychange", function (obj) {
numbox_propertychange(obj.target);
});
this.bind("change", function (obj) {
var onChange = options.onChange;
if (!onChange) return;
var numValue = Number(obj.target.value);
onChange(numValue);
});
this.bind("hide", function (obj) {
var onHide = options.onHide;
if (!onHide) return;
var numValue = Number(obj.target.value);
onHide(numValue);
});
return this;
}
else if (type == 'string') {
// type為字符串類型,代表調(diào)用numbox對(duì)象中的方法
var method = eval(options);
if (method) return method(this, arguments);
}
}
// 屬性值變化事件
function numbox_propertychange(numbox) {
if (numbox.value == '-' || numbox.value == numbox.oldvalue) return;
var numvalue = Number(numbox.value);
if (isNaN(numvalue)) {
numbox.value = numbox.oldvalue;
}
else {
numbox.oldvalue = numbox.value;
}
}
// 獲取值
function getValue(numbox) {
var value = numbox.val();
return Number(value);
}
// 設(shè)置值
function setValue(numbox, params) {
if (params[1] == undefined) return;
var numvalue = Number(params[1]);
if (!isNaN(numvalue)) {
for (var i = 0; i < numbox.length; i++) {
numbox[i].focus();
numbox[i].value = numvalue;
numbox[i].oldvalue = numvalue;
}
}
}
})(jQuery); // 這里傳入jQuery對(duì)象作為參數(shù),是為了避免在模塊內(nèi)部直接去訪問(wèn)全局對(duì)象,避免過(guò)度依賴其他模塊,降低耦合度,更加規(guī)范化,可控性更高,可參考其他成熟jQuery插件(easyui、bootstrap)調(diào)用方法如下
<body>
<input id="test" />
<script>
$("#test").numbox({
width: 150,
height: 20
});
</script>
</body>關(guān)于“jQuery怎么實(shí)現(xiàn)金額錄入框”的內(nèi)容就介紹到這里了,感謝大家的閱讀。如果想了解更多行業(yè)相關(guān)的知識(shí),可以關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道,小編每天都會(huì)為大家更新不同的知識(shí)點(diǎn)。
文章題目:jQuery怎么實(shí)現(xiàn)金額錄入框
網(wǎng)址分享:http://chinadenli.net/article28/phojjp.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供網(wǎng)頁(yè)設(shè)計(jì)公司、ChatGPT、小程序開發(fā)、網(wǎng)站維護(hù)、域名注冊(cè)、品牌網(wǎng)站制作
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)