面具钱不工作的动态增加的投入
mask money not working on dynamically added inputs
我使用jquery.maskMoney.js为输入添加掩码,它适用于正常输入,但它不适用于动态添加的输入。这是我使用的代码
$(document).ready(function() {
var max_fields = 10; //maximum input boxes allowed
var wrapper = $(".input_fields_wrap"); //Fields wrapper
var add_button = $(".add_field_button"); //Add button ID
var x = 1; //initlal text box count
$(add_button).click(function(e){ //on add input button click
e.preventDefault();
if(x < max_fields){
x++; //text box increment
$(wrapper).append('<div><input type="text" name="mytext[]" id="demo['+x+']" /><a href="#" class="remove_field">Remove</a></div>'); //add input box
}
});
$('input[id^="demo"]').each(function () {
$(this).maskMoney({prefix:'R$ ', thousands:'.', decimal:',', affixesStay: true});
});
<div class="input_fields_wrap">
<button class="add_field_button">Add More Fields</button>
<div><input type="text" name="mytext[]" id="demo[1]"></div>
</div>
请帮忙,我卡住了
你可以这样改变你的javascript。看看initMaskMoney()
,它在页面加载和文本字段添加之后都被调用。此外,您不需要迭代每个元素,您可以使用选择器一次选择所有元素。
<script type="text/javascript">
$(document).ready(function() {
var max_fields = 10; //maximum input boxes allowed
var wrapper = $(".input_fields_wrap"); //Fields wrapper
var add_button = $(".add_field_button"); //Add button ID
var x = 1; //initlal text box count
$(add_button).click(function(e){ //on add input button click
e.preventDefault();
if(x < max_fields){
x++; //text box increment
$(wrapper).append('<div><input type="text" name="mytext[]" id="demo['+x+']" /><a href="#" class="remove_field">Remove</a></div>');
//re-init mask money to apply new added input
initMaskMoney();
}
});
initMaskMoney();
});
function initMaskMoney() {
$('input[id^="demo"]').maskMoney({prefix:'R$ ', thousands:'.', decimal:',', affixesStay: true});
}
</script>
看了@Dekel的回答后,我觉得这个版本更方便。initMaskMoney
获得一个名为selector的参数。在此参数的帮助下,您可以初始化当前项的maskmoney,并且只针对新添加的输入(在前面的回答中,所有输入框都再次初始化maskmoney)。
<script type="text/javascript">
$(document).ready(function() {
var max_fields = 10; //maximum input boxes allowed
var wrapper = $(".input_fields_wrap"); //Fields wrapper
var add_button = $(".add_field_button"); //Add button ID
var x = 1; //initlal text box count
$(add_button).click(function(e){ //on add input button click
e.preventDefault();
if(x < max_fields){
x++; //text box increment
var newItem = $('<div><input type="text" name="mytext[]" id="demo['+x+']" /><a href="#" class="remove_field">Remove</a></div>')
$(wrapper).append(newItem); //add input box
//init mask money for only added input
initMaskMoney($(newItem).find('input'));
}
});
//init mask money for current inputs
initMaskMoney('input[id^="demo"]');
});
function initMaskMoney(selector) {
$(selector).maskMoney({prefix:'R$ ', thousands:'.', decimal:',', affixesStay: true});
}
</script>
选择器$('input[id^="demo"]').each
将适用于任何现有的元素,但不适用于新创建的元素。您的问题是,当您单击按钮时-您将新元素添加到文档中,并且在这些元素上您没有启动.hasMoney
插件。
你能做的是在你把新的<input
添加到你的文档之后-调用该元素的.hasMoney
。
你可能想改变一下你的代码:
i = $('<div><input type="text" name="mytext[]" id="demo['+x+']" /><a href="#" class="remove_field">Remove</a></div>')
$(wrapper).append(i); //add input box
i.find('input').maskMoney({prefix:'R$ ', thousands:'.', decimal:',', affixesStay: true});
为字段调用函数添加焦点:
getDecimal2()
{
$("#eupdate_property_luasNet").maskMoney();
}
你可以使用。trigger('mask.maskMoney')来触发格式化。
$("#budget_prevision").maskMoney({
prefix:'R$ ',
allowNegative: false,
thousands:'.',
decimal:',',
affixesStay: false
}).trigger('mask.maskMoney');
相关文章:
- 在使用 javascript 动态添加行时,我正在增加索引值,但出现错误
- 动态增加 iframe 高度
- 在普通javascript中动态增加循环
- 在不增加分析跳出率的情况下,绑定网页上的内部链接以动态加载
- 动态增加 AJAX 加载程序的负载百分比
- 如何在 AngularJS 中动态增加/减少段落元素的高度
- 钛应用器动态文本区域高度增加
- 在JavaScript中动态增加和减少数字
- 动态增加和减少行高ng网格
- 动态增加和减少jQuery滑动条值
- 如何在php中动态地增加选择框选项和字段
- 通过javascript在每次点击时动态增加字体大小
- 无法在javascript中增加动态创建标签的宽度
- 每当我点击spinnerfield, spinnerfield的值增加,我想动态地改变textfield的值
- 我如何动态地增加字体大小与Javascript和为什么是我目前的功能不工作
- 如何在PHP中动态持续增加html表的数量
- 如何增加“背景位置”内容动态依赖于"正确的(徘徊)
- 动态增加离子列表项目的高度嵌入文本区域内容的高度
- 动态增加iframe的高度
- 如何有效地使用jQuery来增加动态渲染表的列