Javascript无法识别动态div内容

时间:2010-06-30 13:54:53

标签: javascript ajax html

我有一个脚本,我一直在与之争斗一周。

我有一个带有id(“content”)div的页面。现在我将一些内容,一个包含在div标签中的表单特定加载到这个div VIA Ajax中,它显示正常

现在,挑战是 - 当提交表单时,我正在调用一个函数来禁用该div标签中元素的所有字段。我总是得到错误“未定义”。

似乎我带入页面的div无法被javascript识别..

我搜索过google,bing,yahoo ..我还没找到解决方案......

拜托,我该怎么办?

我已经包含了以下代码 -

+++++++++ 我的外部javascript文件的下面代码

++++++++++++++++++++

// JavaScript Document

var doc = document;
var tDiv;
var xmlHttp;
var pgTitle;

function getXMLObj(){
        if (window.XMLHttpRequest){
          // code for IE7+, Firefox, Chrome, Opera, Safari
                Obj = new XMLHttpRequest();
          }
        else if (window.ActiveXObject){
            // code for IE6, IE5
                Obj = new ActiveXObject("Microsoft.XMLHTTP");
          }
        else{
                alert("Your browser does not support Ajax!");
        }
        return Obj;
}


function loadCont(toLoad, view){
    doc.getElementById('loadBlank').innerHTML = '<div id="loading">Processing Request...</div>';
    var url;
    switch(toLoad){
        case 'CI':
            pgTitle = "Administration - Company Information";
            url = "comp_info.php?v=" + view + "&sid=" + Math.random();
            break;
        case 'JB':
            pgTitle = "Administration - Jobs";
            url = "jobs.php?v=" + view + "&sid=" + Math.random();
            break;
        case 'US':
            pgTitle = "Administration - Users";
            url = "users.php?v=" + view + "&sid=" + Math.random();
            break;
        case 'EP':
            pgTitle = "Administration - Employees";
            url = "emp.php?v=" + view + "&sid=" + Math.random();
            break;
        case 'AP':
            pgTitle = "Administration - Recruitments";
            url = "applicants.php?v=" + view + "&sid=" + Math.random();
            break;
        case 'JV':
            pgTitle = "Administration - Recruitments";
            url = "jobvacancy.php?v=" + view + "&sid=" + Math.random();
            break;
    }

    xmlHttp = getXMLObj();
    if (xmlHttp !== null && xmlHttp !== undefined){
            xmlHttp.onreadystatechange = loadingContent;
            xmlHttp.open('GET', url, true);
            xmlHttp.send(null);
    }
}

function loadingContent(){

    if (xmlHttp.readyState == 4 || xmlHttp.readyState == 'complete'){
            //Show the loading and the title, but hide the content...
            if (xmlHttp.status == 200){
                doc.getElementById('dMainContent').innerHTML = parseScript(xmlHttp.responseText);
                doc.getElementById('loadBlank').innerHTML = '';
            }
            else{
                doc.getElementById('dMainContent').innerHTML = 'Sorry..Page not available at this time. <br />Please try again later';
                doc.getElementById('loadBlank').innerHTML = '';
            }
    }
    if (xmlHttp.readyState < 4){
            //Show the loading and the title, but hide the content...
            doc.getElementById('ActTitle').innerHTML = pgTitle;
            doc.getElementById('dMainContent').innerHTML = '';
    }
}

function valCompInfo(){
    //First Disable All the elements..
    alert('I was hree');
    DisEnaAll('CompForm');
    //Now..lets validate the entries..
}

function DisEnaAll(contId){
    //alert(doc.getElementById(contId).elements);
    var theId = doc.getElementById(contId).elements;

    try{
        var numElems = theId.length;

        for (var i=0; i < (numElems - 1); i++){
            (theId[i].disabled == false) ? (theId[i].disabled = true) : (theId[i].disabled = false);                
        }
    }
    catch(e){
        var msg = "The following error occurred: \n\n";
        msg += e.description
        alert(msg); 
    }

}


// http://www.webdeveloper.com/forum/showthread.php?t=138830
function parseScript(_source) {
    var source = _source;
    var scripts = new Array();

    // Strip out tags
    while(source.indexOf("<script") > -1 || source.indexOf("</script") > -1) {
        var s = source.indexOf("<script");
        var s_e = source.indexOf(">", s);
        var e = source.indexOf("</script", s);
        var e_e = source.indexOf(">", e);

        // Add to scripts array
        scripts.push(source.substring(s_e+1, e));
        // Strip from source
        source = source.substring(0, s) + source.substring(e_e+1);
    }

    // Loop through every script collected and eval it
    for(var i=0; i<scripts.length; i++) {
        try {
            eval(scripts[i]);
        }
        catch(ex) {
            // do what you want here when a script fails
        }
    }

    // Return the cleaned source
    return source;
 }

此代码位于javascript为

的主页面上
<div id="dMainContent">

</div>
</body>
</html>

最后,我通过ajax加载的页面内容..

<div style="width:738px" id="CompForm">
    <div class="tdright">
        <a href="#" class="lnkBtn" onclick="valCompInfo();"><?php echo $btnNm; ?></a> &nbsp;
     </div>
</div>

那是代码..

谢谢

4 个答案:

答案 0 :(得分:2)

问题在于div标签(id“CompForm”),它不是HTML表单。

“elements”是表单元素的集合,而不是div元素。因此,在尝试访问div.elements时,属性是未定义的。

参见MSDN,form.elements是DOM级别1的一部分(根据MSDN)

http://msdn.microsoft.com/en-us/library/ms537449%28v=VS.85%29.aspx

答案 1 :(得分:0)

将您的Javascript函数或外部JS文件添加到原始页面。

答案 2 :(得分:0)

这不是JavaScript ......

doc.getElementById(contId).elements

但是在你的JavaScript中使用...你绝对不会得到任何东西。 (空)

我认为这也不合适:

theId[i].disabled == false

答案 3 :(得分:-1)

编辑:请注意每条评论:这不是答案:)请参阅评论以了解原因。

作为建议的学习辅助工具,仅作为答案。

不应该

xmlHttp.onreadystatechange = loadingContent; 

xmlHttp.onreadystatechange = loadingContent(); 

loadingContent();

如果你想像那样分配它,那个函数应该返回一个值...