Question

我在JQuery中有一个onChange函数追加调用ajax函数。这是我的代码：

var data='<?php echo $data; ?>';
var tambah=1;
var txt=1;

function add_fullboard_dalam_kota(){


    function showU(str)
    {

        if (str=="")
        {
            document.getElementById(txt).innerHTML="";
            return;
        }
        if (window.XMLHttpRequest)
        {// code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp=new XMLHttpRequest();
        }
        else
        {// code for IE6, IE5
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange=function()
        {
            if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {
                document.getElementById(txt).innerHTML=xmlhttp.responseText;
            }
        }
        xmlhttp.open("GET","gettujuan5.php?q="+str,true);
        xmlhttp.send();
    }


    $("#fullboard_dalam_kota").append('<tr align="center" valign="middle" bgcolor="#E4E4E4">'
        +'<td width="19%" ><input name="penyelenggara[]" type="text" id="'+tambah+'" onchange=showU(this.value)></td>'
        +'<td width="19%" ><div id="'+txt+'"><b></b></div>'  
        +'</td>'
        +'<td width="19%" ><input name="jumlah_peserta[]" type="text" id="jumlah_peserta[]"></td>'
        +'<td width="19%" ><input name="jumlah_hari[]" type="text" id="jumlah_hari[]"></td>'
        +'</tr>')





    tambah=tambah+1;
    txt=txt+1;

}
var data='<?php echo $data; ?>';
var tambah=1;
var txt=1;

function add_fullboard_dalam_kota(){


    function showU(str)
    {

        if (str=="")
        {
            document.getElementById(txt).innerHTML="";
            return;
        }
        if (window.XMLHttpRequest)
        {// code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp=new XMLHttpRequest();
        }
        else
        {// code for IE6, IE5
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange=function()
        {
            if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {
                document.getElementById(txt).innerHTML=xmlhttp.responseText;
            }
        }
        xmlhttp.open("GET","gettujuan5.php?q="+str,true);
        xmlhttp.send();
    }


    $("#fullboard_dalam_kota").append('<tr align="center" valign="middle" bgcolor="#E4E4E4">'
        +'<td width="19%" ><input name="penyelenggara[]" type="text" id="'+tambah+'" onchange=showU(this.value)></td>'
        +'<td width="19%" ><div id="'+txt+'"><b></b></div>'  
        +'</td>'
        +'<td width="19%" ><input name="jumlah_peserta[]" type="text" id="jumlah_peserta[]"></td>'
        +'<td width="19%" ><input name="jumlah_hari[]" type="text" id="jumlah_hari[]"></td>'
        +'</tr>')





    tambah=tambah+1;
    txt=txt+1;

}

但显然onchange函数不起作用，因为它不返回ajax值。我的代码出了什么问题？

Answer 1

问题是您在txt方法中使用全局变量showU，因此txt始终指向页面中不存在的id。

var data = '<?php echo $data; ?>';
var tambah = 1;
var txt = 1;

function showU(str, txt) {

    if (str == "") {
        document.getElementById(txt).innerHTML = "";
        return;
    }
    if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp = new XMLHttpRequest();
    } else { // code for IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange = function () {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            document.getElementById(txt).innerHTML = xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET", "gettujuan5.php?q=" + str, true);
    xmlhttp.send();
}


function add_fullboard_dalam_kota() {
    $("#fullboard_dalam_kota").append('<tr align="center" valign="middle" bgcolor="#E4E4E4">' + '<td width="19%" ><input name="penyelenggara[]" type="text" id="' + tambah + '" onchange="showU(this.value, \'' + txt + '\')"></td>' + '<td width="19%" ><div id="' + txt + '"><b></b></div>' + '</td>' + '<td width="19%" ><input name="jumlah_peserta[]" type="text" id="jumlah_peserta[]"></td>' + '<td width="19%" ><input name="jumlah_hari[]" type="text" id="jumlah_hari[]"></td>' + '</tr>');

    showU();

    tambah = tambah + 1;
    txt = txt + 1;
}

注意：使用jQuery.ajax()代替使用原生ajax

在这种情况下，因为您正在加载html片段，所以使用

function showU(str, txt) {
    if (str == "") {
        $('#' + txt).empty()
        return;
    }
    $('#' + txt).load("gettujuan5.php?q=" + str);
}

在JQuery追加内部调用时，Ajax函数不起作用

1 个答案: