0
html 테이블이있는 웹 페이지가 있습니다. 모든 행에는 다른 서버에있는 약간의 편안한 서비스에 대한 링크가 있습니다.jquery를 통한 여러 건의 ajax 호출이 콜백이 호출되지 않아 실패했습니다.
내가 한 행에있는 버튼을 아약스 호출이 잘 실행 누르고 내가 답을 얻을 때. 루프에서 테이블의 모든 서비스를 호출하려고합니다. 나는 자바 스크립트 배열에 호출을 추가하고 및 이를 실행하기 위해을 적용하면 다음 를 사용합니다. 실행 호출
하나의 데이터를 다시 돌아갑니다. inspect에서 네트워크를 검사하면 안심할 수있는 서비스의 결과를 확인할 수 있지만 jquery keep returns 콜백이 호출되지 않았습니다.
나는 내가 연기 객체에 뭔가를하고 있어요하지만 난 올바르게 사용하는 방법을 이해할 수없는 것을 알고있다.
당신은 http://distml.kstergiou.net/single.html
에서 단일 통화 페이지와 http://distml.kstergiou.net/batch.html
에 배치 버전 당신이 날 내가 뭘 잘못 찾을 수 있습니다 볼 수 있습니까? 당신은 JSONP를 사용 AS
배치 페이지 (JQuery와 및 HTML)의 코드는 기능 callback가 아약스 요청의 반환에라고,
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/bootstrap-theme.min.css">
<script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
<script>
var response = [];
var restArray = [];
$(document).ready(function() {
$('#execBatch').click(function(){
$('#tblMethods tr').each(function(){
var self = $(this);
var inp = self.find('.execSingle');
var urlStr = inp.attr("data-exec");
var rowNum = inp.attr('data-rownum');
var clfData = '';
if (urlStr != undefined) {
restArray.push($.ajax({
cache: true,
type: "GET",
url: urlStr,
data: clfData,
contentType: "application/javascript",
dataType: "jsonp",
crossDomain: true,
jsonp: 'callback',
jsonpCallback: 'callback',
success: function (data) {
response.push(data.strResult);
console.log('success');
},
error: function (xhr, status, error) {
console.log(error);
response[rowNum] = 'Error<br>Status<br>' + status + 'Error Message<br>' + error;
}
})
)
}
});
$.when.apply(null, restArray).done(function(){
console.log(arguments);
for(var i = 0; i < arguments.length; i++) {
console.log(arguments[i][0].strResult);
}
}).fail(function (jqXHR, status, error) {
console.log(status + ' --- ' + error);
});
});
$('.showSingle').click(function() {
var self = $(this);
var rowNum = self.attr('data-rownum');
$('#output').html('<pre>' + response[rowNum] + '</pre>');
});
}); // document.ready
</script>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-xs-12">
<table id="tblMethods" style="border:1px solid blue; width:100%" class="table">
<thead style="border:1px solid green; background-color: #e0e0e0">
<tr>
<th>#</th>
<th>Server</th>
<th>Classifier</th>
<th>Filter</th>
<th>DataFile</th>
<th>Evaluate</th>
<th>numFolds</th>
<th style="display:none">execute</th>
<th style="display:none">completed</th>
</tr>
</thead>
<tbody>
<tr><td>0</td><td>Server 1 - locahost</td><td>Naive Bayes</td><td>No Filter</td><td>Anneal</td><td>false</td><td>10</td><td><input type="button" value="Exec" id="execSingle0" data-rownum="0" data-exec="http://clouddom.ergologic.gr:8080/com.alchemist.ml/rowid/0/clfid/0/filterid/0/fileid/0/eval/false/numfolds/10/" class="btn btn-xs btn-success execSingle" style="display:none"></td><td><input type="button" value="Show" id="showSingle0" data-rownum="0" class="showSingle btn btn-xs btn-info"></td></tr>
<tr><td>1</td><td>Server 1 - locahost</td><td>SMO</td><td>No Filter</td><td>Anneal</td><td>false</td><td>10</td><td><input type="button" value="Exec" id="execSingle1" data-rownum="1" data-exec="http://clouddom.ergologic.gr:8080/com.alchemist.ml/rowid/1/clfid/1/filterid/0/fileid/0/eval/false/numfolds/10/" class="btn btn-xs btn-success execSingle" style="display:none"></td><td><input type="button" value="Show" id="showSingle1" data-rownum="1" class="showSingle btn btn-xs btn-info"></td></tr>
<tr><td>2</td><td>Server 1 - locahost</td><td>J48</td><td>No Filter</td><td>Anneal</td><td>false</td><td>10</td><td><input type="button" value="Exec" id="execSingle2" data-rownum="2" data-exec="http://clouddom.ergologic.gr:8080/com.alchemist.ml/rowid/2/clfid/7/filterid/0/fileid/0/eval/false/numfolds/10/" class="btn btn-xs btn-success execSingle" style="display:none"></td><td><input type="button" value="Show" id="showSingle2" data-rownum="2" class="showSingle btn btn-xs btn-info"></td></tr>
<tr><td>3</td><td>Server 1 - locahost</td><td>RandomForest</td><td>No Filter</td><td>Anneal</td><td>false</td><td>10</td><td><input type="button" value="Exec" id="execSingle3" data-rownum="3" data-exec="http://clouddom.ergologic.gr:8080/com.alchemist.ml/rowid/3/clfid/8/filterid/0/fileid/0/eval/false/numfolds/10/" class="btn btn-xs btn-success execSingle" style="display:none"></td><td><input type="button" value="Show" id="showSingle3" data-rownum="3" class="showSingle btn btn-xs btn-info"></td></tr>
<tr><td>4</td><td>Server 1 - locahost</td><td>RandomTree</td><td>No Filter</td><td>Anneal</td><td>false</td><td>10</td><td><input type="button" value="Exec" id="execSingle4" data-rownum="4" data-exec="http://clouddom.ergologic.gr:8080/com.alchemist.ml/rowid/4/clfid/9/filterid/0/fileid/0/eval/false/numfolds/10/" class="btn btn-xs btn-success execSingle" style="display:none"></td><td><input type="button" value="Show" id="showSingle4" data-rownum="4" class="showSingle btn btn-xs btn-info"></td></tr>
</tbody>
</table>
</div>
</div>
<br>
<input type=button name="BuildAll" id="execBatch" class="btn btn-xs btn-info execBatch" value="Build All"/>
<hr>
<div id="output" style="border:1px solid red"></div>
</body>
</html>
내 생각 엔 여러하려는 경우 JSONP 당신은 당신이 그것을 지정하는 것보다 jQuery를 동적으로 오히려 콜백 이름을 만들 수 있도록이 같은 시간에 비행에서 호출하는 것입니다. 콜백 이름을 지정하면 모든 아약스 호출은 동일한 콜백 이름을 사용하게되고 jQuery는 어떤 응답인지 알 수 없으므로 상황이 매우 혼란스러워진다. – jfriend00
변경해야 할 첫 번째 일은'response'가 추가되는 방법입니다 - 성공과 오류 모두에 대해'response [rowNum] = ...'을 사용하십시오. 그런 다음 .then() 체인을 생성하여 순차적으로 ajax 요청을 수행하도록 호출 패턴을 변경하십시오. –