我有一个Ajax调用，在文档加载后被触发，就在ajax调用之下，我已经为提交按钮提交了事件......
如果删除stmt警报（“New Start”），则不会触发click事件。我确定ajax调用中有bug但不确定它是什么？
$.ajax({
type:"GET",
dataType:"json",
url:"/getresponse/",
data:{},
context:this,
success:function(response){
//event.preventDefault()
console.log("Value of response =" + response['table_appl']['IPTEXT'])
var vms = ['appl','enfr','det01','det02','det03','det04','det05','datais']
vms.forEach(function(i){
var header;
switch ( i )
{
case 'appl':
header = "APPL"
break;
case 'enfr':
header = "EN"
break;
case 'det01':
header = "D01"
break;
case 'det02':
header = "D02"
break;
case 'det03':
header = "D03"
break;
case 'det04':
header = "D04"
break;
case 'det05':
header = "D05"
break;
case 'datais':
header = "DT"
break;
}
//console.log("Value of response =" + response['table_appl']['IPTEXT'])
//value = ' + response['table_' + i + ']['IPTEXT']
//console.log(" Main loop IP =" + response['table_'+ i ]['IPTEXT'] )
iptext = response['table_'+ i ]['IPTEXT']
dns1text = response['table_'+ i ]['DNS1TEXT']
dns2text = response['table_'+ i ]['DNS2TEXT']
gwtext = response['table_'+ i ]['GWTEXT']
nmtext = response['table_'+ i ]['NMTEXT']
ntp1text = response['table_'+ i ]['NTP1TEXT']
ntp2text = response['table_'+ i ]['NTP2TEXT']
id1text = response['table_'+ i ]['ID1TEXT']
hosttext = response['table_'+ i ]['HOSTTEXT']
if (!iptext){
//console.log("Its null")
iptext = ''
}
if (!dns1text){
//console.log("Its null")
dns1text = ''
}
if (!dns2text){
//console.log("Its null")
dns2text = ''
}
if (!gwtext){
//console.log("Its null")
gwtext = ''
}
if (!nmtext){
//console.log("Its null")
nmtext = ''
}
if (!ntp1text){
//console.log("Its null")
ntp1text = ''
}
if (!ntp2text){
//console.log("Its null")
ntp2text = ''
}
if (!hosttext){
//console.log("Its null")
hosttext = ''
}
if (!id1text){
//console.log("Its null")
id1text = ''
}
console.log('iptext = ' +iptext)
$('#div2').append('<div id=\'div2' + i + '\'>');
$('#div2' + i + '').addClass('box');
$('#div2' + i + '').append('<h2>' + header + '</h2>');
$('#div2' + i + '').append('<table id=\'table_' + i + '\' cellspacing=\'20\'></table>');
$('#table_' + i + '').append('<tr><td> <label for=\'ipaddresslabel\'>IPADDRESS</label> </td>' +
'<td> <input type=\'text\' name=\'IP\' value =\'' + iptext + '\' > </td> <td> <label id=\'DISPLAYIP\' for=\'success\' style="DISPLAY:none">Validated</label> </td></tr>');
$('#table_' + i + '').append('<tr><td> <label for=\'dns1label\'>DNS1</label> </td>' +
'<td> <input type=\'text\' name=\'DNS1\' value =\'' + dns1text + '\' > </td> <td> <label id=\'DISPLAYDNS1\' for=\'success\' style="DISPLAY:none">Validated</label> </td></tr>');
$('#table_' + i + '').append('<tr><td> <label for=\'dns2label\'>DNS2</label> </td>' +
'<td> <input type=\'text\' name=\'DNS2\' value =\'' + dns2text + '\' > </td> <td> <label id=\'DISPLAYDNS2\' for=\'success\' style="DISPLAY:none">Validated</label> </td></tr>');
$('#table_' + i + '').append('<tr><td> <label for=\'gwlabel\'>GATEWAY</label> </td>' +
'<td> <input type=\'text\' name=\'GW\' value =\'' + gwtext + '\'> </td> <td> <label id=\'DISPLAYGW\' for=\'success\' style="DISPLAY:none">Validated</label> </td></tr>');
$('#table_' + i + '').append('<tr><td> <label for=\'nmlabel\'>NETMASK</label> </td>' +
'<td> <input type=\'text\' name=\'NM\' value =\'' + nmtext + '\'> </td> <td> <label id=\'DISPLAYNM\' for=\'success\' style="DISPLAY:none">Validated</label> </td></tr>');
$('#table_' + i + '').append('<tr><td> <label for=\'ntp1label\'>NTPSERVER1</label> </td>' +
'<td> <input type=\'text\' name=\'NTP1\' value =\'' + ntp1text + '\'> </td> <td> <label id=\'DISPLAYNTP1\' for=\'success\' style="DISPLAY:none">Validated</label> </td></tr>');
$('#table_' + i + '').append('<tr><td> <label for=\'ntp2label\'>NTPSERVER2</label> </td>' +
'<td> <input type=\'text\' name=\'NTP2\' value =\'' + ntp2text + '\'><td> <label id=\'DISPLAYNTP2\' for=\'success\' style="DISPLAY:none">Validated</label> </td></tr>');
$('#table_' + i + '').append('<tr><td> <label for=\'hostlabel\'>HOSTNAME</label> </td>' +
'<td> <input type=\'text\' name=\'HOST\' value =\'' + hosttext + '\'> </td> <td> <label id=\'DISPLAYHOST\' for=\'success\' style="DISPLAY:none">Validated</label> </td></tr>');
$('#table_' + i + '').append('<tr><td> <label for=\'idlabel\'>INTERNAL DOMAIN</label> </td>' +
'<td> <input type=\'text\' name=\'ID1\' value =\'' + id1text + '\'> </td> <td> <label id=\'DISPLAYID1\' for=\'success\' style="DISPLAY:none">Validated</label> </td></tr>');
$('#table_' + i + '').append('<tr><td> </td>' +
'<td> <input type="submit" value=\'save\' id=\'sub' + i + '\' /></td> <td> </td></tr>');
//$('#div2' + i + '').append('<div id=\'div2' + i + 'footer\'>');
//$('#div2' + i + 'footer').append('<input type="submit" value=\'save\' id=\'sub' + i + '\' />')
}
);
$('#div2enfr').hide();
$('#div2det01').hide();
$('#div2det02').hide();
$('#div2det03').hide();
$('#div2det04').hide();
$('#div2det05').hide();
$('#div2datais').hide();
alert('End')
}
})
//alert("New Start")
$("#table_appl,#table_enfr,#table_det01,#table_det02,#table_det03,#table_det04,#table_det05,#table_datais").on( "click", "input:submit",
function( event ) {
答案 0 :(得分：1)
AJAX调用没有错误，只是对代码执行顺序的误解。我假设AJAX调用响应用于创建事件处理程序随后绑定的元素。
在那里有alert语句，执行可能如下所示：
没有alert语句，执行如下所示：
你显然希望在 4之后发生，所以将它移动到AJAX调用的success回调的末尾。或者，修改委托的事件处理程序代码，以便在AJAX请求完成之前查找确实存在的元素，这也需要您修改作为第二个参数传递给.on()的选择器。
答案 1 :(得分：0)
请记住，Ajax调用是异步的，因此如果您在事件句柄中使用来自ajax响应的任何信息，则很可能此类信息尚不可用。警报只是“消耗”ajax调用完成的时间。
您可以尝试在ajax调用中使用同步模式以查看它是否有效。