我有一个脚本来掩盖文本框,在这里
<script src="http://jquery-joshbush.googlecode.com/
files/jquery.maskedinput-1.2.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery(function($) {
$('#j').mask('99:99');
});
</script>
我还有一个脚本,可以在单击按钮时动态添加文本框
<script type="text/javascript">
function addRow(tableID) {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
var row = table.insertRow(rowCount);
var colCount = table.rows[0].cells.length;
for(var i=0; i<colCount; i++) {
var newcell = row.insertCell(i);
newcell.innerHTML = table.rows[0].cells[i].innerHTML;
//alert(newcell.childNodes);
switch(newcell.childNodes[0].type) {
case "text":
newcell.childNodes[0].value = "";
newcell.childNodes[0].id="j";
alert(newcell.childNodes[0].id);
break;
case "checkbox":
newcell.childNodes[0].checked = false;
break;
case "select-one":
newcell.childNodes[0].selectedIndex = 0;
break;
}
}
}
function deleteRow(tableID) {
try {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
for(var i=0; i<rowCount; i++) {
var row = table.rows[i];
var chkbox = row.cells[0].childNodes[0];
if(null != chkbox && true == chkbox.checked) {
if(rowCount <= 1) {
alert("Cannot delete all the rows.");
break;
}
table.deleteRow(i);
rowCount--;
i--;
}
}
}catch(e) {
alert(e);
}
}
</script>
和我的输入框是
<INPUT type="text" name="STime[]" id="j"/>
]
我现在面临的问题是,第一个文本框将具有蒙版结构,但是在我借助j脚本动态添加文本框之后,我将不会获得被蒙版的文本框?为什么?我做错了什么?
使用livequery plug-in。然后,提供要掩盖类maskme
的所有元素。现在您可以执行以下操作:
$(".maskme").livequery(function(){
$(this).mask('99:99');
});
即使在第一次运行代码后,这也会屏蔽添加的输入。
使用您要定位的类创建事件绑定到输入(不必使用ID,则不必使用ID)。使用jQuery .on方法http://api.jquery.com/on/
示例:
<input class="classSelector" />
<script>
$(document).on("focus", "classSelector", function() {
$(this).mask("99:99");
});
</script>
您可以动态创建所需的任意多个输入,并使用on事件绑定将其屏蔽。您创建的带有该类的每个新输入都将附加该事件处理程序。
首先在输入中不使用ID
<input type="text" name="STime[]" class="jClass"/>
第二,如果您使用jQuery,请使用它。这更容易阅读。
<script type="text/javascript">
function addRow(tableID) {
var table = $("#" + tableID); //get the table
var firstRowClone = $("tr:first", table).clone(); //clone the first row
$("input:checkbox",firstRowClone).attr("checked", false); // set all checkboxes to unchecked
$("select", firstRowClone).each(function () { //Set all select lists to select first item
this.selectedIndex = 0;
}
table.append(firstRowClone); //append the cloned row to the table.
$("input:text", firstRowClone).val("").mask("99:99"); //set all input type="text" with value of "" and sets the mask on the clone.
});
function deleteRow(tableID) {
$("#" + tableId + " tr:not(:eq(0))").remove(); //Remove all rows except the first row.
}
$(document).ready(function {
$('.jClass').mask('99:99'); //sets the mask on any rows loaded initially
});
</script>
掩码插件不会将绑定实时绑定到DOM中的新元素,而是绑定到$('#j')选择器中当时存在的元素上。
.mask()
。在脚本中不要在脚本中使用ID使用类以用于多人使用时间掩码ghj