- C# code
<script type="text/javascript">
var count = 0;
function AddProduct() {
if (count == 12)
return;
count += 1;
var File1 = document.getElementById("file1");
var div = document.createElement("div");
var countTxt = document.createTextNode("SN" + count);
var inputTxt = document.createElement("input");
inputTxt.type = "text";
inputTxt.name = "txtSN" + count;
var btn = document.createElement("input");
btn.type = "button";
btn.value = "Cancel";
btn.onclick = function () {
this.parentNode.parentNode.removeChild(this.parentNode);
//alert(this.parentNode.nodeName);
var str = File1.innerHTML;
var re = /[^<]+/i;
var n = File1.getElementsByTagName("div");
for (var k = 0; k < n.length; k++) {
n[k].innerHTML = n[k].innerHTML.replace(re, "SN" + (k + 1));
n[k].getElementsByTagName("input").item(1).onclick = this.onclick;
}
count -= 1;
}
inputTxt.onchange = function () {
}
div.appendChild(countTxt);
div.appendChild(inputTxt);
div.appendChild(btn);
File1.appendChild(div);
}
</script>
以代码实现了asp.net 页面中动态的添加若干个div节点，内容包括一个Text 节点，一个文本框和一个按钮，现在我想实现在inputText这些文本框中输入信息的时候，验证它里面的数据和前面的所有同类inputText中的文本信息不同。如果相同就提示并返回。代码中inputTxt.onchange = function () { }该怎么写，求指点！
------解决方案--------------------
建议楼主贴个能运行的 html+js ，这样方便解决问题，不然就只有猜了。
------解决方案--------------------
我猜楼主是不是担心动态添加的时候和前面重复了呀~
如果那样的话~你建个字符串str,
str=$("看你情况写抓取规则,抓到所有的同类数组元素").text( ); 哦~没法用jquery是吧~
这里你str+=数组元素的innerTEXT;
然后用最新输入的这个去验证前面的~indexof(str)~ 没有就返回-1
然后你响应动作~
------解决方案--------------------
//大致这样写
inputTxt.onchange = function () {
txtNode = this.previousSibling.nodeValue;
if (txtNode != this.value) {
alert("不一致");
}
}
------解决方案--------------------
LZ可以把inputTxt的name设成一样的，比如"txtSN"。
id设成唯一的，用来区别 "txtSN" + count;
inputTxt.onchange = function () {
var inputTxtArr=document.getElementsByName("txtSN");
for(var i=0;i<inputTxtArr.length;i++)
{
if(inputTxtArr[i].value==this.value&&inputTxtArr[i].id!=this.id)
{
alert("重复");
}
}
}
------解决方案--------------------
- HTML code
<!doctype html>
<html>
<head>
<meta charset="utf-8"/>
</head>
<body>
<input type="button" id="add" value="add" />
<div id="file1"></div>
<script type="text/javascript">
document.getElementById('add').onclick = function(){
var File1 = document.getElementById("file1");
AddProduct(File1);
if(!initEvent.hsdInit){
initEvent(File1);
}
}
var count = 0;
function AddProduct(container) {
if (count == 12)
return;
count += 1;
var container = document.getElementById("file1"),
div = document.createElement("div"),
countTxt = document.createElement("label"),
inputTxt = document.createElement("input");
countTxt.innerHTML = "SN" + count;
inputTxt.type = "text";
inputTxt.name = "txtSN" + count;
var btn = document.createElement("input");
btn.type = "button";
btn.value = "Cancel";
inputTxt.addEventListener("focusout", function(){
alert(2);
}, false);
div.appendChild(countTxt);
div.appendChild(inputTxt);
div.appendChild(btn);
container.appendChild(div);
}
function initEvent(elem){
var divs = elem.getElementsByTagName("div");
elem.onclick = function(event){
var e = event || window.event,
target = e.target || e.srcElement;
if(target.tagName !== "INPUT" || target.type !== "button"){
return false;
}
var parent, div, label;
parent = target.parentNode;
parent.parentNode.removeChild(parent);
for(var i = 0, len = divs.length; i < len; i++){
div = divs[i];
if(div === parent){
delete divs[i];
i--;
}else{
label = div.getElementsByTagName("label")[0];
label.innerHTML = label.innerHTML.replace(/\d+/, i + 1);
}
}
}
if(document.addEventListener){
elem.addEventListener('blur', function(event){
changeHandle(event);
}, true);
}else{
elem.onfocusout = changeHandle;
}
var changeHandle = (function(){
var oldValue;
return function(event){
var e = event || window.event,
target = e.target || e.srcElement,
value = target.value,
parent = target.parentNode;
var div, inputTxt;
if(target.tagName !== "INPUT" || target.type !== "text"){
return false;
}
if(value !== oldValue){
oldValue = value;
return false;
}else{
for(var i = 0, len = divs.length; i < len; i++){
div = divs[i];
if(div === parent){
continue;
}
inputTxt = div.getElementsByTagName("input")[0];
if(inputTxt.value === value){
alert("文本框输入值重复了!");
}
}
}
}
})();
initEvent.hsdInit = true;
}
</script>
</body>
</html>