Ajax의 여러 동적 URL

아약스에 최대 6 개의 URL을 가져 오는 데 어려움이 있습니다. 본질적으로 양식을 가져 와서 양식 입력란에 URL을 입력하십시오. 그런 다음 '로드'를 누릅니다. jquery [JS # 1 참조]은 입력 된 내용을 가져와 Ajax 호출을로드합니다.Ajax의 여러 동적 URL

그러나 '추가 기능'버튼을 누르면 최대 5 개의 입력란이 추가됩니다. 여기서 문제는 5 개의 입력 필드를 채우고 'load'를 누를 때입니다.
ajax URL을 별도로로드하지 않습니다. 그냥 빈 배열. 지연된 js로드에 대한 연구를 수행했습니다. 하지만 분명히 옳은 일을하지는 않습니다.

그런 다음 다른 접근 방식을 시도했습니다. [JS # 2 참조] 기본적으로 ajax 호출을 수동으로 작성합니다. 그리고 이것은 나에게 더 나은 결과를주었습니다. 그러나 세 개의 입력 필드에 입력하고 '로드'를 누르면 입력 필드 중 하나를 잡고 세 번 반복합니다.

HTML

<!DOCTYPE html> 
<html> 
<head> 
    <title></title> 
</head> 
<body> 
    <div id="tFormBox"> 
     <div class="tInputTop"> 
      <h1>Add Up to 6</h1> 
     </div> 
     <div class="tInputBottom"> 
      <label class="sr-only" for="cInput">Enter Name</label> 
      <div class="c-input-fields"> 
       <div id="cInput"> 
        <input class="form-control" name="cInput" placeholder="Enter Name"> 
        <div class="add-more"></div> 
       </div> 
      </div><button id="chInputBtn">LOAD</button> 
     </div> 
    </div> 
</body> 
</html>

JS # 1

var feed; 
var sURLs = document.getElementsByClassName('cInput'); 
$('#cInput').click(function() { 
    $(this).toggleClass('focused'); 
}) 
$('#cInput > .add-more').click(function() { 
    // -- Limit to 6 more Additional Input Boxes --// 
    var i = $('.InputBottom div').length; 
    var cInput = $('<div id="cInput ' + i + ' "><input class="cInput" class="form-control" name="cInput" placeholder="Enter Name"></input></div>'); 
    $.each(cInput, function(i, val) { 
     alert(cInput[i]); 
    }); 
    if (i <= 7) { 
     console.log('adding') 
     $(cInput).appendTo('.c-input-fields'); 

    } else { 
     console.log('maxed') 
    } 
}) 
$('#cInput').on('click', function(tags) { 
    getS(); 
}) 

function getS() { 
    // --grab URLS to a maximum of 6 --// 
    for (var i = 0; i < sURLs.length; i++) { 
     var sValue = sURLs[i].value; 
    } 

    function multipleAjax(number, deferredObject) { 
     $.ajax({ 
      url: '/' + 'sValue', 
      type: "GET", 
      success: function(data) { 
       results.push(data); 
       deferredObject.resolve(); 
      } 
     }); 
    } 
    var deferreds = []; 
    var results = []; 
    var nothingImportant; 
    for (var i = 0; i < nothingImportant; i++) { 
     var deferredObject = new $.Deferred(); 
     deferreds.push(deferredObject); 
     multipleAjax(i, deferredObject); 
    } 
    // check if all ajax calls have finished 
    $.when.apply($, deferreds).done(function() { 
     console.log(results); 
     console.log(sValue) 
    }); 
}

JS # 2

function getS() { 
// --grab URLS to a maximum of 6 --// 
for (var i = 0; i < sURLs.length; i++) { 
    var sValue = sURLs[i].value; 
} 

var async2 = $.ajax({ 
    type: 'GET', 
    url: '/' + sValue, 
    success: function(data) { 
     console.log(data) 
    }, 
    error: function(data) { 
     alert('notworking') 
    } 
}) 
var async1 = $.ajax({ 
    type: 'GET', 
    url: '/' + sValue, 
    success: function(data) { 
     console.log(data); 
    }, 
    error: function(data) { 
     alert('notworking') 
    } 
}) 
var async3 = $.ajax({ 
    type: 'GET', 
    url: '/' + sValue, 
    success: function(data) {}, 
    error: function(data) { 
     alert('notworking') 
    } 
}) 
$.when(async3, async2, async1).done(function(result3, result2, result1) {});

}

,451,515,

출처

2017-05-22 askmeaquestion1234

. ** 특정 문제 **를 분명히 하시거나 추가 세부 사항을 추가하여 필요한 것을 정확히 강조하십시오. 현재 작성된 내용이므로 귀하가 원하는 내용을 정확하게 말하기는 어렵습니다. 이 질문에 대한 설명은 [How to Ask] (https://stackoverflow.com/help/how-to-ask) 페이지를 참조하십시오. –

이 시도 : _exactly_ 여기에 요청을 받고 있는지 불분명하다

// --grab URLS to a maximum of 6 --// 
var sValues = []; //array of urls 
for (var i = 0; i < sURLs.length; i++) { 
    sValues[i].push(sURLs[i].value); 
} 

function multipleAjax(number, deferredObject) { 
     $.ajax({ 
      url: '/' + sValues[number], 
      type: "GET", 
      success: function(data) { 
       results.push(data); 
       deferredObject.resolve(); 
      } 
     }); 
    }

출처

2017-05-22 16:01:51 divinemaniac

Ajax의 여러 동적 URL

답변

관련 문제