函數的返回值返回undefined

Question

我有一個HTML表單，如果輸入文本的值爲www，用戶可以輸入url。在它中，我將創建一個變量並將其返回給函數，然後將其傳遞給ajax，但似乎當我在控制檯中檢查它（ajaxData var）時，它說未定義。

<form action="" id="defaultForm"> 
    <input type="text" id="url"> 
    <button id="submit">Submit</button> 
</form> 

JS：

$(function() { 
    function myreturnValue() { 
     $('#defaultForm').submit(function() { 

     var w = 'www.'; 
     var current = $('#url').val(); 
     var appendW = w + current; 

     if (current.match('www.')) { 
      console.log('it already consists of www'); 
      var returnValue = 'site_url:' + current; //site_url:www.domain.com or http:// 
      console.log(typeof returnValue); 
      return returnValue; 
     } else { 
      var returnValue = 'site_url:' + appendW; //www+url 
      console.log(current); 
      console.log(appendW); 
      console.log(returnValue); 
      return returnValue; 
     } 
     }); //end submit 
    } 
    var ajaxData = myreturnValue(); 
    console.log(typeof ajaxData); 
    var data = 'data:{' + ajaxData + '}'; 
}); 

然後在AJAX我將通過數據變量。我希望我的解釋很清楚。

Answer 1

在你的代碼

目前，myreturnValue函數只執行代碼，註冊一個事件監聽到你的形式，沒有返回值（您return語句只能在submit事件觸發），所以這就是爲什麼它會返回undefined在第一時間。

試試這個：

• 把你的網址檢測功能myreturnValue
• 邏輯然後把一個代碼，以防止默認提交事件被解僱
• 最後註冊一個事件偵聽器提交按鈕。

而你的原始正則表達式www.的意思是將www與另一個字符如wwww匹配。和www0。將是有效的。您可以考慮將其更改爲其他正則表達式像this one

$(function() { 
 
    function myreturnValue() { 
 
    var w = 'www.'; 
 
    var current = $('#url').val(); 
 
    var appendW = w + current; 
 
    if (current.match(w)) { 
 
     console.log('it already consists of www'); 
 
     var returnValue = 'site_url:' + current; //site_url:www.domain.com or http:// 
 
     console.log(typeof returnValue); 
 
     return returnValue; 
 
    } else { 
 
     var returnValue = 'site_url:' + appendW; //www+url 
 
     console.log(current); 
 
     console.log(appendW); 
 
     console.log(returnValue); 
 
     return returnValue; 
 
    } 
 
    } 
 
    $('#defaultForm').submit(function(e) { 
 
    e.preventDefault(); 
 
    }); 
 
    $('#submit').on('click', function() { 
 
    var data = 'data:{' + myreturnValue() + '}'; 
 
    console.log(data); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form action="" id="defaultForm"> 
 
    <input type="text" id="url"> 
 
    <button id="submit">Submit</button> 
 
</form>

Answer 2

這裏有一些問題。

調用$('#defaultForm').submit(function() {將提交處理程序綁定到表單。它不提交表單也不執行函數。請熟悉with the documentation。

您的myreturnValue()不會返回任何內容。您只有一個頂級行，即上面的提交綁定。不僅它不被執行，而且該函數中的return不會像你所期望的那樣傳播。在事件處理程序內部返回將不會在任何情況下執行任何操作。

請不要在if分支內部聲明vars。

下面是重組此代碼的快速嘗試，但有了這些問題，更正後的代碼可能取決於您的特定需求。

(function() { 
    $('#defaultForm').submit(function (event) { 

     // prevent default form submit 
     event.preventDefault(); 

     var w = 'www.'; 
     var current = $('#url').val(); 
     var appendW = w + current; 
     var value; 

     if (current.match('www.')) { 
      console.log('it already consists of www'); 
      value = 'site_url:' + current; //site_url:www.domain.com or http:// 
      console.log(typeof returnValue); 
     } else { 
      value = 'site_url:' + appendW; //www+url 
      console.log(current); 
      console.log(appendW); 
      console.log(returnValue); 
     } 

     var data = 'data:{' + ajaxData + '}'; 

     // Do whatever you want with data here 

    }); 

    // If you want to now submit the form by hand... 
    $('#defaultForm').submit(); 

}); 

Answer 3

在你的代碼中，myreturnValue（）只返回函數的returnValue中提交。 'myreturnValue'函數返回任何東西，因爲它沒有任何返回值。

您執行了不必要的函數來獲取ajaxData。 要獲得ajaxData，你只需要

$('#defaultForm').submit(function() { 
    contents 
} 

如果修復代碼簡單...

$('#defaultForm').submit(function() { 
    var returnValue; 
    var w = 'www.'; 
    var current = $('#url').val(); 
    var appendW = w + current; 

    if (current.match('www.')) { 
    console.log('it already consists of www'); 
    returnValue = 'site_url:' + current; //site_url:www.domain.com or http:// 
    console.log(typeof returnValue); 
    } else { 
    returnValue = 'site_url:' + appendW; //www+url 
    console.log(current); 
    console.log(appendW); 
    console.log(returnValue); 
    } 
    console.log(typeof returnValue); 
    var data = 'data:{' + ajaxData + '}'; 
    console.log('data : ', data) 
}); 

請注意：http://codepen.io/onyoon7/pen/mRdJJV