將承諾綁定到函數

我一直在試圖向函數添加一個承諾，以便它等待函數先完成。我試過$.when和.promise()以及添加了一個計數器和一個變量，這個變量在.map函數完成時發生了變化，但我無法使用checkInput()函數完成並在if語句之前更改x，inputSmartCheck和inputTNACheck的值執行。因此，即使checkInput()將x的值更改爲1，if語句在執行此操作之前執行並返回true。我有一點經驗Javascript（我更喜歡jQuery），但我認爲我冒險進入先進領域。任何幫助，將不勝感激。將承諾綁定到函數

 $(document).on("click", ".updateNewRows", function(){ 
     $("#inputTNACheck").val("0"); //hidden inputs 
     $("#inputSmartCheck").val("0"); //hidden inputs 
     var x=0; 
     checkInput(); 
     if(x==0 && $("#inputTNACheck").val()=="0" && $("#inputSmartCheck").val()=="0"){ 
      $(".newStart").each(function() { 
       var get = $(this).closest(".newStart"); 
       var data = { 
        empID:get.find(".tna_id").val(), 
        smart:get.find(".smart_uname").val(), 
        first:get.find(".f_name").val(), 
        last:get.find(".l_name").val(), 
        date:get.find(".start_date").val(), 
        type:get.find(".type").val() 
       }; 
       $.post('new_user_process_bulk_create_records.php', data, function(data,textStatus) { 
        console.log(textStatus); 
        $("#newUsersTable").remove(); 
        $(".updateNewRows").remove(); 
        if ($("#returnUsersTable").html()) { 
         $("#newUsersRow").html('<div class="alert alert-success">Updated</div>'); 
        } 
        else{ 
         location.reload(); 
        } 

       }); 
      }); 
     } 
    }); 



    function checkInput(){ 
     $('.newStart').map(function() {  

      var get = $(this).closest(".newStart"); 

      var id = get.find(".tna_id"); 
      var smart = get.find(".smart_uname"); 
      var first = get.find(".f_name"); 
      var last = get.find(".l_name"); 
      var type = get.find(".type"); 
      var smartCheck = $.ajax({ 
       url: "new_user_validate_bulk_upload.php", 
       type: "POST", 
       data: {smart:smart.val(), type:'smart'}, 
       success: function(data) { 
        if(data!="ok"){ 
         $("#inputSmartCheck").val("1"); 
         smart.css('background-color', 'pink'); 
        } 
        else{smart.css('background-color', 'white');} 
       } 
      }); 

      var tnaCheck = $.ajax({ 
       url: "new_user_validate_bulk_upload.php", 
       type: "POST", 
       data: {tna:id.val(), type:'tna'}, 
       success: function(data) { 
        if(data!="ok"){ 
         $("#inputTNACheck").val("1"); 
         id.css('background-color', 'pink'); 
        } 
        else{id.css('background-color', 'white');} 
       } 
      }); 
      $.when(smartCheck, tnaCheck).then(function() { 

       var name = new RegExp('^[a-zA-Z-]{0,20}$'); 
       var smartID = new RegExp('^[a-zA-Z0-9]{0,10}$'); 
       var empID = new RegExp('^[0-9]{0,10}$'); 

       if (!name.test(first.val()) || first.val()=='') { 
        x=1; 
        first.css('border', '1px solid red'); 
       }else{first.css('border', '1px solid #CCC');} 

       if (!name.test(last.val()) || last.val()=='') { 
        x=1; 
        last.css('border', '1px solid red'); 
       }else{last.css('border', '1px solid #CCC');} 

       if(!smartID.test(smart.val()) || smart.val()==''){ 
        x=1; 
        smart.css('border', '1px solid red'); 
       }else{smart.css('border', '1px solid #CCC');} 

       if(!empID.test(id.val()) || id.val()==''){ 
        x=1; 
        id.css('border', '1px solid red'); 
       }else{id.css('border', '1px solid #CCC');} 

       if(type.val()==''){ 
        x=1; 
        type.css('border', '1px solid red'); 
       }else{type.css('border', '1px solid #CCC');} 
      });//$.when close 
     }); 
    }

來源

2016-10-28 redd42

一些基礎知識第一...

我不能讓checkInput（）函數來完成和改變

x在你的事件處理程序中定義x的值，因此當您在checkInputs()中引用它時，即使它在您的事件處理函數中被調用調用，它也無法訪問在您的事件處理函數的作用域中定義的變量在該事件處理程序中也定義了checkInputs函數。（我不建議在這種情況下，這將意味着你正在創建一個函數在每次事件處理程序運行，而不是一個大問題，但仍然沒有必要時間。）

if語句執行
前

因爲checkInputs()做異步的事情，你不能依靠簡單地調用它，沒有一些方法來確定它是否完成。好消息是，你正在與承諾的正確軌道。

checkInputs目前的工作方式，您永遠不會知道是否所有的異步內容都在您的if聲明之前完成。我們來研究一下，以一些基於checkInputs函數的示例代碼爲例。

function checkInputs() { 
    // an array to store the async calls 
    var asyncCalls = []; 

    // iterate over all the things 
    // changed to .each() because "each" is for iterating, 
    // and "map" is for returning a new array 
    $('.newStart').each(function() { 
     // get all your variables and stuff 
     var smartCheck = $.ajax({...}); 

     var tnaCheck = $.ajax({...}); 

     var asyncCallsPromise = $.when(smartCheck, tnaCheck).then(function() { 
      // do stuff 

      console.log(arguments); 
     }); 
     asyncCalls.push(asyncCallsPromise); 
    }); 

    // the important part, return a promise so you can check 
    // when checkInputs has processed all the things 
    return $.when.apply($, asyncCalls); 
} 

// somewhere else... 
checkInputs().then(function() { 
    console.log('all the calls are done'); 
    // here you can do the things that need to happen after checking the inputs 
    // e.g. the if statement. 
});

希望在正確的方向這個小推有助於

來源

2016-10-28 12:00:03 Dymos

將承諾綁定到函數

回答

相關問題